Android实现左上角（其他边角）倾斜的标签（环绕效果）效果

概述Android实现左上角（其他边角）倾斜的标签（环绕效果）效果 先上效果图吧 由于项目需要实现这种左上角倾斜环绕的标签效果,所以自己尝试着做一做,并记录下来. 实现的思路大致如下图: 主页面的布局结构如下: <?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/andr ...

先上效果图吧

由于项目需要实现这种左上角倾斜环绕的标签效果，所以自己尝试着做一做，并记录下来。

实现的思路大致如下图：

主页面的布局结构如下：

<?xml version="1.0" enCoding="utf-8"?><androIDx.constraintlayout.Widget.ConstraintLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  xmlns:app="http://schemas.androID.com/apk/res-auto"  xmlns:tools="http://schemas.androID.com/tools"  androID:layout_wIDth="match_parent"  androID:background="#fff"  androID:layout_height="match_parent"  tools:context=".MainActivity">  <relativeLayout    androID:layout_wIDth="300dp"    androID:layout_height="200dp"    androID:background="#fff"    app:layout_constraintBottom_toBottomOf="parent"    app:layout_constraintleft_toleftOf="parent"    app:layout_constraintRight_toRightOf="parent"    app:layout_constrainttop_totopOf="parent" >    <relativeLayout      androID:layout_wIDth="match_parent"      androID:layout_height="match_parent"      androID:layout_margin="5dp"      androID:background="#33B7F3"      androID:elevation="2dp"></relativeLayout>    <com.zc.labeldemo.LabelVIEw      androID:ID="@+ID/labelVIEw"      androID:layout_alignParenttop="true"      androID:layout_wIDth="75dp"      androID:elevation="3dp"      androID:layout_height="75dp"/>  </relativeLayout></androIDx.constraintlayout.Widget.ConstraintLayout>

绘制倾斜标签的代码如下：

package com.zc.labeldemo;import androID.content.Context;import androID.graphics.Canvas;import androID.graphics.color;import androID.graphics.Paint;import androID.graphics.Path;import androID.util.AttributeSet;import androID.vIEw.VIEw;import androIDx.annotation.Nullable;/** * @author wenchao * @version 1.0.1 * @classname LabelVIEw * @date 2019/9/20 * @description */public class LabelVIEw extends VIEw {  /**   * 画笔   */  private Paint paint;  /**   * Path   */  private Path path;  /**   * VIEw宽度   */  private float wIDth;  /**   * VIEw高度   */  private float height;  /**   * 标签背景宽度   */  private float labelWIDth;  /**   * 标签折叠区域宽度   */  private float pointWIDth;  /**   * 标签折叠区域高度   */  private float pointHeight;  /**   * 标签背景颜色   */  private int labelcolor;  /**   * 标签折叠区域背景颜色   */  private int pointcolor;  /**   * 中心点x坐标   */  private float centerX;  /**   * 中心点y坐标   */  private float centerY;  /**   * 标签文字内容   */  private String text;  /**   * 标签文字颜色   */  private int textcolor;  public LabelVIEw(Context context) {    super(context);  }  public LabelVIEw(Context context,@Nullable AttributeSet attrs) {    super(context,attrs);    init();  }  private voID init() {    labelWIDth = 120;    pointWIDth = 10;    pointHeight = 17;    paint = new Paint();    path = new Path();    paint.setAntiAlias(true);    paint.setstrokeWIDth(10);    setBackgroundcolor(color.transparent);    labelcolor = color.parsecolor("#EA6724");    pointcolor = color.parsecolor("#C43200");    text = "测试内容";    textcolor = color.WHITE;  }  @OverrIDe  protected voID onSizeChanged(int w,int h,int olDW,int oldh) {    super.onSizeChanged(w,h,olDW,oldh);    wIDth = w;    height = h;    centerX = w/2;    centerY = h/2;  }  @OverrIDe  public voID draw(Canvas canvas) {    super.draw(canvas);    //画标签区域背景上边的折叠区域（小三角区域）    path.reset();    path.moveto(wIDth-pointWIDth,0);    path.lineto(wIDth,pointHeight);    path.lineto(wIDth-pointWIDth-26,pointHeight);    path.close();    paint.setcolor(pointcolor);    canvas.drawPath(path,paint);    //画标签背景区域下边的折叠区域    path.reset();    path.moveto(0,height-pointWIDth);    path.lineto(pointHeight,height);    path.lineto(pointHeight,height-pointWIDth-26);    path.close();    paint.setcolor(pointcolor);    canvas.drawPath(path,paint);    //画标签背景区域    path.reset();    paint.setcolor(labelcolor);    paint.setStyle(Paint.Style.FILL);    path.moveto(wIDth-labelWIDth-pointWIDth,0);    path.lineto(wIDth-pointWIDth,0);    path.lineto(0,height-pointWIDth);    path.lineto(0,height-labelWIDth-pointWIDth);    canvas.drawPath(path,paint);    //画文字 逆时针选择45度    canvas.rotate(-45,centerX,centerY);    //文字中心点横坐标    float textx = wIDth / 2;    //文字中心点纵坐标    float textY = (height-pointWIDth-(labelWIDth / 2f)) / 2f;    paint.setcolor(textcolor);    paint.setStyle(Paint.Style.FILL);    paint.setTextSize(38);    //设置文字居中绘制    paint.setTextAlign(Paint.Align.CENTER);    canvas.drawText(text,textx,textY,paint);  }}

这个标签实现应该是比较简单的，而且多嵌套一层布局会消耗一定的资源，这里先简单记录一下实现的思路，后期有时间再做更改优化。下面再贴一张其他边角的效果图吧：

总结

以上所述是小编给大家介绍的AndroID实现左上角（其他边角）倾斜的标签（环绕效果）效果,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！
如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！

总结

以上是内存溢出为你收集整理的Android实现左上角（其他边角）倾斜的标签（环绕效果）效果全部内容，希望文章能够帮你解决Android实现左上角（其他边角）倾斜的标签（环绕效果）效果所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。