Chip icon – Round chip icon using picasso library android
Chip icon using picasso library
Chip (s) are compact elements that represent an attribute, text, entity, or action. They allow users to enter information, select a choice, filter content, or trigger an action.
app:chipIcon) and end (app:closeIcon) drawables. Picasso allows for hassle-free image loading . Normal case picasso load images and that image is converted to drawable for Icon. Which works only if image is already cached. Otherwise the resulting icon is placeholder image or error image.By using trigger a callback is created which will get the image and place it.It only works by using setTag, With out “setTag” trigger get garbage collected.
BottomApp Bar Material Theme 2
ChipGroup
app:singleLine attribute to constrain the chips to a single horizontal line. If you do so, you’ll usually want to wrap this ChipGroup in a HorizontalScrollView.
ChipGroup also supports a multiple-exclusion scope for a set of chips. When you set the app:singleSelection attribute, checking one chip that belongs to a chip-group unchecks any previously checked chip within the same group. The behavior mirrors that of RadioGroup.
MainActivity
public class MainActivity extends AppCompatActivity {
private LinkedHashMap<String, Target> chipRecordHash;
private ChipGroup chipGroup;
private String [] nameList={"Google","Android","Windows","Chrome","Git hub","Facebook"};
private String [] iconList={"https://cdn2.iconfinder.com/data/icons/social-icons-33/128/Google-512.png",
"https://cdn2.iconfinder.com/data/icons/social-icons-33/128/Android-512.png",
"https://cdn1.iconfinder.com/data/icons/logotypes/32/windows-512.png",
"https://cdn1.iconfinder.com/data/icons/smallicons-logotypes/32/chrome-512.png",
"https://cdn0.iconfinder.com/data/icons/octicons/1024/mark-github-512.png",
"https://cdn1.iconfinder.com/data/icons/logotypes/32/square-facebook-512.png"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
chipGroup=findViewById(R.id.chipGroup);
intChips();
MaterialButton remove=findViewById(R.id.remove);
remove.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
removeChip("Facebook");
}
});
}
private void intChips(){
chipRecordHash=new LinkedHashMap<>();
for (int i=0;i<nameList.length;i++) {
final Chip chip = new Chip(this, null, R.style.Widget_MaterialComponents_Chip_Action);
chip.setText(nameList[i]);
chip.setCloseIconVisible(true);
chipGroup.addView(chip);
final int finalI = i;
chip.setOnCloseIconClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
chipGroup.removeView(chip);
chipRecordHash.remove(nameList[finalI]);
}
});
Target target=getTargetOfPicasso(chip);
String linkOfIcon=iconList[i];
Picasso.get().load(linkOfIcon).error(R.drawable.icon_no_image).
placeholder(R.drawable.icon_place_holder).
transform(new CircleTransform()).resize(30,30).into(target);
chip.setTag(target);
// --- setting target as tag is in-case the images is not loaded the target get garbage collected
// setTaging the target prevent it from garbage collecting
chipRecordHash.put(nameList[i],target);
//If you want to remove some chips threw another ways like button click etc
}
}
private Target getTargetOfPicasso(final Chip targetChip){
return new Target() {
@Override
public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {
Drawable d = new BitmapDrawable(getResources(), bitmap);
targetChip.setChipIcon(d);
}
@Override
public void onBitmapFailed(Exception e, Drawable errorDrawable) {
targetChip.setChipIcon(errorDrawable);
}
@Override
public void onPrepareLoad(Drawable placeHolderDrawable) {
targetChip.setChipIcon(placeHolderDrawable);
}
};
}
private void removeChip(String chipName){
Chip chip=chipGroup.findViewWithTag(chipRecordHash.get(chipName));
if (chip!=null) {
chipGroup.removeView(chip);
chipRecordHash.remove(chipName);
}else {
Toast.makeText(this,"Not available",Toast.LENGTH_SHORT).show();
}
}
}Xml For MainActivity
