Skip to content

Instantly share code, notes, and snippets.

@makunomark
Last active September 27, 2021 15:54
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save makunomark/8ca7c9e57dc1b034b5cf30f7e4a0c912 to your computer and use it in GitHub Desktop.
Save makunomark/8ca7c9e57dc1b034b5cf30f7e4a0c912 to your computer and use it in GitHub Desktop.
To create an android bouncy badge on toolbar icon
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadius="0dp"
android:shape="ring"
android:thickness="9dp"
android:useLevel="false">
<solid android:color="@color/button_fb_normal" />
<stroke
android:width="1dip"
android:color="#FFF" />
</shape>
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/bounce_interpolator">
<translate
android:duration="900"
android:fromXDelta="100%p"
android:toXDelta="0%p" />
</set>
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/bounce_interpolator">
<!-- Use your working translate animation here-->
<translate
android:duration="900"
android:fromXDelta="100%p"
android:toXDelta="0%p" />
</set>
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="vertical"
android:gravity="center"
android:layout_gravity="center"
android:padding="4dp"
android:clickable="true">
<ImageView
android:id="@+id/badge_icon_button"
android:layout_width="35dp"
android:layout_height="35dp"
android:textColor="@color/white"
android:textSize="24sp"
android:tint="#fff"
app:srcCompat="@drawable/ic_shopping_cart_black_24dp" />
<TextView
android:id="@+id/badge_textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignEnd="@id/badge_icon_button"
android:layout_alignRight="@id/badge_icon_button"
android:layout_alignTop="@id/badge_icon_button"
android:background="@drawable/badge_background"
android:gravity="center"
android:padding="6dp"
android:layout_marginLeft="0dp"
android:layout_marginStart="0dp"
android:layout_marginEnd="2dp"
android:layout_marginRight="2dp"
android:layout_marginTop="-6dp"
android:text="20"
android:textColor="#FFF"
android:textSize="10sp" />
</RelativeLayout>
public class Home extends AppCompatActivity{
...
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_shop, menu);
for (int i = 0; i < menu.size(); i++) {
Drawable drawable = menu.getItem(i).getIcon();
if (drawable != null) {
drawable.mutate();
drawable.setColorFilter(getResources().getColor(R.color.white), PorterDuff.Mode.SRC_ATOP);
}
}
View v = menu.findItem(R.id.mCart).getActionView();
badge = (TextView) v.findViewById(R.id.badge_textView);
updateBadge();
v.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
startActivity(new Intent(Home.this, Cart.class));
}
});
return super.onCreateOptionsMenu(menu);
}
private void animateBadge(){
Animation bounce = AnimationUtils.loadAnimation(this, R.anim.bounce);
badge.startAnimation(bounce);
}
}
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="#FF000000"
android:pathData="M7,18c-1.1,0 -1.99,0.9 -1.99,2S5.9,22 7,22s2,-0.9 2,-2 -0.9,-2 -2,-2zM1,2v2h2l3.6,7.59 -1.35,2.45c-0.16,0.28 -0.25,0.61 -0.25,0.96 0,1.1 0.9,2 2,2h12v-2L7.42,15c-0.14,0 -0.25,-0.11 -0.25,-0.25l0.03,-0.12 0.9,-1.63h7.45c0.75,0 1.41,-0.41 1.75,-1.03l3.58,-6.49c0.08,-0.14 0.12,-0.31 0.12,-0.48 0,-0.55 -0.45,-1 -1,-1L5.21,4l-0.94,-2L1,2zM17,18c-1.1,0 -1.99,0.9 -1.99,2s0.89,2 1.99,2 2,-0.9 2,-2 -0.9,-2 -2,-2z"/>
</vector>
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/mCart"
android:title="Cart"
app:actionLayout="@layout/cart_icon"
app:showAsAction="always" />
</menu>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment