真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

Android如何實(shí)現(xiàn)左上角傾斜的標(biāo)簽效果

這篇文章給大家分享的是有關(guān)Android如何實(shí)現(xiàn)左上角傾斜的標(biāo)簽效果的內(nèi)容。小編覺(jué)得挺實(shí)用的,因此分享給大家做個(gè)參考,一起跟隨小編過(guò)來(lái)看看吧。

創(chuàng)新互聯(lián)專(zhuān)注于零陵網(wǎng)站建設(shè)服務(wù)及定制,我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗(yàn)。 熱誠(chéng)為您提供零陵?duì)I銷(xiāo)型網(wǎng)站建設(shè),零陵網(wǎng)站制作、零陵網(wǎng)頁(yè)設(shè)計(jì)、零陵網(wǎng)站官網(wǎng)定制、微信小程序服務(wù),打造零陵網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供零陵網(wǎng)站排名全網(wǎng)營(yíng)銷(xiāo)落地服務(wù)。

先上效果圖吧

Android如何實(shí)現(xiàn)左上角傾斜的標(biāo)簽效果

由于項(xiàng)目需要實(shí)現(xiàn)這種左上角傾斜環(huán)繞的標(biāo)簽效果,所以自己嘗試著做一做,并記錄下來(lái)。

實(shí)現(xiàn)的思路大致如下圖:

Android如何實(shí)現(xiàn)左上角傾斜的標(biāo)簽效果

主頁(yè)面的布局結(jié)構(gòu)如下:



  
    
    
  

繪制傾斜標(biāo)簽的代碼如下:

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 {
  /**
   * 畫(huà)筆
   */
  private Paint paint;
  /**
   * Path
   */
  private Path path;
  /**
   * View寬度
   */
  private float width;
  /**
   * View高度
   */
  private float height;
  /**
   * 標(biāo)簽背景寬度
   */
  private float labelWidth;
  /**
   * 標(biāo)簽折疊區(qū)域?qū)挾?
   */
  private float pointWidth;
  /**
   * 標(biāo)簽折疊區(qū)域高度
   */
  private float pointHeight;
  /**
   * 標(biāo)簽背景顏色
   */
  private int labelColor;
  /**
   * 標(biāo)簽折疊區(qū)域背景顏色
   */
  private int pointColor;
  /**
   * 中心點(diǎn)x坐標(biāo)
   */
  private float centerX;
  /**
   * 中心點(diǎn)y坐標(biāo)
   */
  private float centerY;
  /**
   * 標(biāo)簽文字內(nèi)容
   */
  private String text;
  /**
   * 標(biāo)簽文字顏色
   */
  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 = "測(cè)試內(nèi)容";
    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);
    //畫(huà)標(biāo)簽區(qū)域背景上邊的折疊區(qū)域(小三角區(qū)域)
    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);
    //畫(huà)標(biāo)簽背景區(qū)域下邊的折疊區(qū)域
    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);
    //畫(huà)標(biāo)簽背景區(qū)域
    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);
    //畫(huà)文字 逆時(shí)針選擇45度
    canvas.rotate(-45,centerX,centerY);
    //文字中心點(diǎn)橫坐標(biāo)
    float textX = width / 2;
    //文字中心點(diǎn)縱坐標(biāo)
    float textY = (height-pointWidth-(labelWidth / 2f)) / 2f;
    paint.setColor(textColor);
    paint.setStyle(Paint.Style.FILL);
    paint.setTextSize(38);
    //設(shè)置文字居中繪制
    paint.setTextAlign(Paint.Align.CENTER);
    canvas.drawText(text,textX,textY,paint);
  }
}

這個(gè)標(biāo)簽實(shí)現(xiàn)應(yīng)該是比較簡(jiǎn)單的,而且多嵌套一層布局會(huì)消耗一定的資源,這里先簡(jiǎn)單記錄一下實(shí)現(xiàn)的思路,后期有時(shí)間再做更改優(yōu)化。下面再貼一張其他邊角的效果圖吧:

Android如何實(shí)現(xiàn)左上角傾斜的標(biāo)簽效果

感謝各位的閱讀!關(guān)于“Android如何實(shí)現(xiàn)左上角傾斜的標(biāo)簽效果”這篇文章就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,讓大家可以學(xué)到更多知識(shí),如果覺(jué)得文章不錯(cuò),可以把它分享出去讓更多的人看到吧!


本文名稱(chēng):Android如何實(shí)現(xiàn)左上角傾斜的標(biāo)簽效果
當(dāng)前鏈接:http://weahome.cn/article/gsidip.html

其他資訊

在線咨詢(xún)

微信咨詢(xún)

電話咨詢(xún)

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部