自定义带三角形箭头的TextView

<?xml version="1.0" encoding="utf-8"?>

<resources>

<declare-styleable name="ArrowTextView">

<attr name="radius" format="dimension" />

<attr name="arrowWidth" format="dimension" />

<attr name="arrowInHeight" format="dimension" />

<attr name="bg" format="color" />

</declare-styleable>

</resources>

package com.example.sanjjiaoxing;

import android.content.Context;

import android.content.res.TypedArray;

import android.graphics.Canvas;

import android.graphics.Color;

import android.graphics.Paint;

import android.graphics.Path;

import android.graphics.RectF;

import android.util.AttributeSet;

import android.util.TypedValue;

import android.view.View;

import android.widget.LinearLayout;

import android.widget.TextView;

/**

* @author wuxif_000  带三角形箭头的(三角形在一定高度居中,超过该高度不管......),四角带圆角,

*

*/

public class ArrowTextView extends TextView {

public ArrowTextView(Context context, AttributeSet attrs) {

super(context, attrs);

ini(context, attrs);

}

private void ini(Context context, AttributeSet attrs) {

TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.ArrowTextView);

radius=typedArray.getDimension(R.styleable.ArrowTextView_radius, 0);

arrowWidth=typedArray.getDimension(R.styleable.ArrowTextView_arrowWidth, 0);

arrowInHeight=typedArray.getDimension(R.styleable.ArrowTextView_arrowInHeight, 0);

color=typedArray.getColor(R.styleable.ArrowTextView_bg, Color.RED);

}

public ArrowTextView(Context context, AttributeSet attrs, int defStyle) {

super(context, attrs, defStyle);

ini(context, attrs);

}

public ArrowTextView(Context context) {

super(context);

}

private float radius;

private float   arrowWidth;

/**

* 三角形箭头在此高度居中......

*/

private float  arrowInHeight;

private int color;

/**

* @param arrowWidth  三角形箭头的宽度.......

*/

public void setArrowWidth(float arrowWidth){

this.arrowWidth=arrowWidth;

invalidate();

}

/**

* @param arrowInHeight   三角形箭头在此高度居中......

*/

public void setArrowInHeight(float arrowInHeight){

this.arrowInHeight=arrowInHeight;

invalidate();

}

/**

* @param radius  矩形四角圆角的半径..........

*/

public void setRadius(float radius){

this.radius=radius;

invalidate();

}

/**

* @param color   箭头矩形的背景色.........

*/

public void setBgColor(int color){

this.color=color;

invalidate();

}

@Override

protected void onDraw(Canvas canvas) {

Paint paint=new Paint();

paint.setColor(color==0?Color.RED:color);

paint.setAntiAlias(true);

if(radius==0){

radius=TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 5, getResources().getDisplayMetrics());

}

if(arrowWidth==0){

arrowWidth=TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 10, getResources().getDisplayMetrics());

}

//带圆角的矩形(左边减去三角形的宽度...........)

int left = (int) (getPaddingLeft()-arrowWidth);

int height=getHeight();

canvas.drawRoundRect(new RectF(left, 0, getWidth(), height), radius, radius, paint);

if(arrowInHeight==0){

arrowInHeight = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 50, getResources().getDisplayMetrics());

}

height = (int) (height>arrowInHeight?arrowInHeight:height);

//画三角形

Path path=new Path();

path.setFillType(Path.FillType.EVEN_ODD);

float yMiddle = height/2;

float yTop=yMiddle-(arrowWidth/2);

float yBottom=yMiddle+(arrowWidth/2);

path.moveTo(0, yMiddle);

path.lineTo(left, yTop);

path.lineTo(left, yBottom);

path.lineTo(0, yMiddle);

path.close();

canvas.drawPath(path, paint);

// canvas.restore();

// canvas.translate(left, 0);

super.onDraw(canvas);

}

}

//用法

<com.example.sanjjiaoxing.ArrowTextView

android:id="@+id/arrowText"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_alignParentRight="true"

android:layout_below="@+id/textView1"

android:layout_marginTop="63dp"

android:paddingBottom="10dp"

android:paddingLeft="15dp"

android:paddingRight="10dp"

android:paddingTop="10dp"

android:text="qqqqqqqqqqqqddddddsdfsfdfdfddddfdsfdfdfdfdfdfdfdfdddddddddddddddddqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq"

wuxifu:bg="@color/green"

wuxifu:radius="10dp" />

时间: 2024-10-14 10:54:16

自定义带三角形箭头的TextView的相关文章

自己定义带三角形箭头的TextView

<?xml version="1.0" encoding="utf-8"? > <resources> <declare-styleable name="ArrowTextView"> <attr name="radius" format="dimension" /> <attr name="arrowWidth" format=&q

【Android】Android实现自定义带文字和图片的Button

在Android开发中经常会需要用到带文字和图片的button,下面来讲解一下常用的实现办法. 一.用系统自带的Button实现 最简单的一种办法就是利用系统自带的Button来实现,这种方式代码量最小.在Button的属性中有一个是drawableLeft,这个属性可以把图片设置在文字的左边,但是这种方式必须让icon的背景色是透明的,如果icon的背景色不是透明的话,会导致点击按钮时icon部分的背景色不会发生变化. 主要代码: <Button android:id="@+id/bt3

自定义带图片和文字的ImageTextButton

今天我们来讲一下有关自定义控件的问题,今天讲的这篇是从布局自定义开始的,难度不大,一看就明白,估计有的同学或者开发者看了说,这种方式多此一举,但是小编我不这么认为,多一种解决方式,就多一种举一反三的学习.下一次或者过几天我会从自定义属性,在布局文件中使用属性的方式再讲一篇关于自定义控件的文章,希望对大家能够有所帮助. 现在开始讲自定义带图片和文字的ImageTextButton的实现方法. 效果图如下: 第一步:新建一个image_text_buttton.xml的布局文件,供自定义的控件使用

android控件---自定义带文本的ImageButton

由于SDK提供的ImageButton只能添加图片,不能添加文字:而Button控件添加的文字只能显示在图片内部:当我们需要添加文字在图片外部时就不能满足我们的需求了,顾只能自己写个自定义ImageButton.说是ImageButton,其实并不是继承于ImageButton,而是从LinearLayout继承,由于LinearLayout是线性排列,通过setOrientation(LinearLayout.VERTICAL)的方式达到View垂直排列的目的,所以很简单,只需要添加两个Vie

纯CCS绘制三角形箭头图案

用CSS绘制三角形箭头.使用纯CSS,你只需要很少的代码就可以创作出各种浏览器都兼容的三角形箭头! CSS代码: /* create an arrow that points up */ div.arrow-up { width: 0; height: 0; border-left: 5px solid transparent; /* left arrow slant */ border-right: 5px solid transparent; /* right arrow slant */

Android 自定义带刻度的seekbar

自定义带刻度的seekbar 1.布局 <span style="font-family:SimHei;font-size:18px;"><com.imibaby.client.views.CustomSeekbar android:id="@+id/myCustomSeekBar" android:layout_width="wrap_content" android:layout_height="wrap_cont

20款带左右箭头的焦点图片轮播特效代码

20款带左右箭头的焦点图片轮播特效代码分享 html5带倒影3D图片叠加轮播切换特效 jQuery slide图片自动轮播滚动插件 jQuery焦点图插件带按钮控制图片轮播滚动代码 jquery仿hao123带新闻标题图片轮播滚动效果 jQuery仿瑞丽全屏透明遮罩图片轮播滚动代码 jQuery带网上开户表单的焦点图轮播代码 jquery左右箭头控制带缩略图片轮播切换 jQuery responsiveslides.js响应式图片轮播特效 jQuery OwlCarousel图片滚动插件世界杯图

【Android-EditText】自定义带删除功能的EditText

我们经常在一些应用中见到输入框带有删除功能,今天我们就来实现这个功能(文字组织能力不强,大家随便看看).主要是记录一下自己的学习经历,如果对大家有帮助,我会更开心的. 先上图: 实现要点: 1.当输入框为空时,删除按钮隐藏: 2.当输入框不为空时,显示删除按钮. 核心代码: package com.example.view; import com.example.ui.R; import android.content.Context; import android.graphics.Rect;

带左右箭头切换的自动滚动图片JS特效

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-