Android实现未读消息小红点显示实例
目录
- 代码实现
- 小红点实现
- 总结
使用 fragmentlayout 实现，可以把小红点添加到任意 view 上。
效果 添加小红点到 textview 上
添加小红点到 imageview 上
代码实现
首先定义一个圆形 drawable
import android.graphics.canvas;
import android.graphics.colorfilter;
import android.graphics.paint;
import android.graphics.pixelformat;
import android.graphics.drawable.drawable;
import android.graphics.drawable.shapedrawable;
import androidx.annotation.intrange;
import androidx.annotation.nonnull;
import androidx.annotation.nullable;
public class circledrawable extends shapedrawable {
private paint mpaint;
private int mradio;
public circledrawable(int radio, int paincolor) {
mpaint = new paint();
mpaint.setantialias(true);
mpaint.setcolor(paincolor);
mradio = radio;
}
@override
public void draw(@nonnull canvas canvas) {
canvas.drawcircle(mradio, mradio, mradio, mpaint);
}
@override
public void setalpha(@intrange(from = 0, to = 255) int i) {
mpaint.setalpha(i);
}
@override
public void setcolorfilter(@nullable colorfilter colorfilter) {
mpaint.setcolorfilter(colorfilter);
}
@override
public int getopacity() {
return pixelformat.translucent;
}
/***
* drawable实际宽高，圆形关键
*
* @return
*/
@override
public int getintrinsicwidth() {
return mradio * 2;
}
@override
public int getintrinsicheight() {
return mradio * 2;
}
}
小红点实现
思路：
一个容器 fragmentlayout 包含两个 view （小红点view + 文本view 「当然也可以是其他的view」），通过 fragmentlayout 添加 view 重叠的特征实现
当前有待优化点：
1、通过 margin 实现小红点可以添加到任意位置「可以是有 layoutparams margin 实现」
2、其他
import android.content.context;
import android.graphics.canvas;
import android.graphics.color;
import android.graphics.rect;
import android.graphics.drawable.colordrawable;
import android.graphics.drawable.shapedrawable;
import android.graphics.drawable.shapes.ovalshape;
import android.graphics.drawable.shapes.roundrectshape;
import android.util.attributeset;
import android.util.printer;
import android.view.gravity;
import android.view.view;
import android.view.viewgroup;
import android.widget.framelayout;
import android.widget.textview;
import androidx.annotation.nullable;
import com.primer.common.constant.gravitydirection;
import com.primer.common.mvp.logininterface;
import com.primer.common.util.loghelper;
import com.primer.common.util.uihelper;
import com.primer.common.view.drawable.circledrawable;
public class badgeview extends textview {
private final int default_badge_radio = 5;
private final int default_text_size = 5;
private final int default_text_color = color.white;
private final int default_badge_color = color.red;
private final int default_badge_gravity = gravitydirection.direct_top_left;
private string mtext;
private int mbadgecolor = default_badge_color;
private int mtextcolor = default_text_color;
private int mtextsize = default_text_size;
private int mbadgeradio = default_badge_radio;
private int mbadgegravity = default_badge_gravity;
private framelayout mfragmentlayout;
private viewgroup mtargetviewgroup;
private view mtarget;
private context mcontext;
public badgeview(context context) {
super(context);
init(context);
}
public badgeview(context context, @nullable attributeset attrs) {
super(context, attrs);
init(context);
}
public badgeview(context context, @nullable attributeset attrs, int defstyleattr) {
super(context, attrs, defstyleattr);
init(context);
}
public badgeview(context context, @nullable attributeset attrs, int defstyleattr, int defstyleres) {
super(context, attrs, defstyleattr, defstyleres);
init(context);
}
private void init(context context) {
mfragmentlayout = new framelayout(context);
mfragmentlayout.setlayoutparams(new framelayout.layoutparams(
viewgroup.layoutparams.match_parent, viewgroup.layoutparams.match_parent));
mcontext = context;
}
/***
*
* @param content
* @param target
* @param textcolor
* @param textsize
* @param badgecolor
* @param badgeradio
*/
public void showbadgeview(string content, view target, int textcolor, int textsize, int badgecolor, int badgeradio) {
if (target == null) {
throw new illegalargumentexception("target view must not be null");
}
mtarget = target;
mtargetviewgroup = (viewgroup) target.getparent();
mtargetviewgroup.removeview(target);
mtargetviewgroup.addview(mfragmentlayout, target.getlayoutparams());
settextcolor(mtextcolor);
settextsize(mtextsize);
setgravity(gravity.center);
if (content != null && content.length() <= 3) {
settext(content);
}
//文字和半径之间的适配
if (content != null) {
rect rect = new rect();
this.getpaint().gettextbounds(content, 0, content.length(), rect);
if (content.length() <= 3 && rect.width() >= mbadgeradio) {
mbadgeradio = (uihelper.px2dip(mcontext, rect.width()) / 2) + 1;
}
}
setbackgrounddrawable(getshapedrawable());
mfragmentlayout.addview(target);
mfragmentlayout.addview(this);
mtargetviewgroup.invalidate();
}
private shapedrawable getshapedrawable() {
int radio = uihelper.dip2px(mcontext, mbadgeradio);
circledrawable drawable = new circledrawable(radio, mbadgecolor);
return drawable;
}
/***
*
* @param content
* @param target
*/
public void showbadgeview(string content, view target) {
showbadgeview(content, target,
default_text_color,
default_text_size,
default_badge_color,
default_badge_radio);
}
public void showbadgeview(view target) {
showbadgeview(null, target,
default_text_color,
default_text_size,
default_badge_color,
default_badge_radio);
}
@override
protected void onmeasure(int widthmeasurespec, int heightmeasurespec) {
super.onmeasure(widthmeasurespec, heightmeasurespec);
}
@override
protected void ondraw(canvas canvas) {
super.ondraw(canvas);
}
@override
protected void onlayout(boolean changed, int left, int top, int right, int bottom) {
super.onlayout(changed, left, top, right, bottom);
}
}
使用
private badgeview mreadbadgeview;
private textview mread;
mreadbadgeview = new badgeview(getactivity());
mreadbadgeview.showbadgeview("+99", mread);
总结
到此这篇关于android实现未读消息小红点显示实例的文章就介绍到这了,更多相关android未读消息小红点内容请搜索萬仟网以前的文章或继续浏览下面的相关文章希望大家以后多多支持萬仟网！
看完文章，还可以扫描下面的二维码下载快手极速版领4元红包
除了扫码领红包之外，大家还可以在快手极速版做签到，看视频，做任务，参与抽奖，邀请好友赚钱）。
邀请两个好友奖最高196元，如下图所示：
