欢迎来到代码驿站!

Android代码

当前位置:首页 > 移动开发 > Android代码

Android 实现带角标的ImageView(微博,QQ消息提示)

时间:2021-03-23 09:35:32|栏目:Android代码|点击:

角标绘制过程:用画笔量出一个字符的宽度作为角标背景的半径(R),然后判断传入字符串的总长度

如果只有一位字符:那么就以 R 为半径,画一个圆,然后在圆中写上数字

如果有两位以上的字符,就不能单纯用一个圆了,用画笔测量字符串的完整长度( len ),然后在右上角画一个圆,在这个圆的圆心左边 len 长度的位置 作为圆心再画一个圆,最后以这个两个圆的上下顶点(一共四个)构成一个矩形,进行填充

源码地址:https://github.com/SiKang123/AndroidToolBox

效果如下:

集成方法

在Project的 build.gradle 下添加

allprojects {
  repositories {
    ...
    maven { url 'https://jitpack.io' }
  }
}

在Module的 build.gradle 下添加

dependencies {
    compile 'com.github.SiKang123:AndroidToolBox:1.0'
}

使用方法

图片中的效果,Layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:gravity="center_horizontal"
  android:orientation="vertical"
  android:paddingTop="50dp">

  <android.simple.toolbox.widget.CornerImageView
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_margin="20dp"
    android:src="@mipmap/ic_launcher"
    app:cornerBackground="@color/red"
    app:cornerText="9"
    app:cornerTextColor="@color/white"
    app:cornerTextSize="11dp" />

  <android.simple.toolbox.widget.CornerImageView
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_margin="20dp"
    android:src="@mipmap/ic_launcher"
    app:cornerBackground="@color/red"
    app:cornerText="99"
    app:cornerTextColor="@color/white"
    app:cornerTextSize="11dp" />

  <android.simple.toolbox.widget.CornerImageView
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_margin="20dp"
    android:src="@mipmap/ic_launcher"
    app:cornerBackground="@color/red"
    app:cornerText="999"
    app:cornerTextColor="@color/white"
    app:cornerTextSize="11dp" />

  <android.simple.toolbox.widget.CornerImageView
    android:id="@+id/progress_imageview"
    android:layout_width="60dp"
    android:layout_height="60dp"
    android:layout_margin="20dp"
    android:src="@mipmap/ic_launcher"
    app:cornerBackground="@mipmap/shanchu"
    app:cornerLoadColor="@color/alpha_black_35"
    app:cornerRadius="7dp" />
</LinearLayout>

Activtiy:

@Override
  protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_cornerimage);
    //设置最后一个图片的加载进度为20%,并添加点击事件
    CornerImageView imageView = (CornerImageView) findViewById(R.id.progress_imageview);
    imageView.progress(20);
    imageView.setOnCornerClickListener(new CornerImageView.OnCornerClickListener() {
      @Override
      public void onCornerClickListener(View view) {
        Toast.makeText(SimpleCornerImageActivity.this, "角标被点击", Toast.LENGTH_SHORT).show();
      }
    });
  }

上一篇:Android颜色编辑器的制作中遇到的问题分析

栏    目:Android代码

下一篇:深入解析Android中的事件传递

本文标题:Android 实现带角标的ImageView(微博,QQ消息提示)

本文地址:http://www.codeinn.net/misctech/86525.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有