Android自定义控件

最新推荐文章于 2023-05-15 11:35:23 发布
最新推荐文章于 2023-05-15 11:35:23 发布
阅读量272 收藏
点赞数
分类专栏： android 文章标签： android UI 自定义控件
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/gao2419956747/article/details/60326605
版权

Android自定义控件

1.组合控件。

几个现有控件，组合起来，达到使用的目的。初始化时，新布局填充到控件上。

组合控件定义一个密码输入框，右侧可以点击图标，来切换密码是显示或隐藏。

布局文件：由editText和img组成。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="60dp"
    tools:context="com.example.yijian.testanination.MainActivity">
    <EditText
        android:id="@+id/et_password"
        android:hint="请输入密码"
        android:singleLine="true"
        android:maxLength="50"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@null"/>
    <RelativeLayout
        android:id="@+id/gy_rl_edittext_right"
        android:layout_width="48dp"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:gravity="center"
        >
        <ImageView
            android:id="@+id/gy_img_edittext_right"
            android:background="@drawable/gy_password_eye_off"
            android:clickable="false"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </RelativeLayout>
</RelativeLayout>

定义控件类继承RelativeLayout

public class MyTextView extends RelativeLayout {
    private RelativeLayout layout = null;
    private EditText mEtPassword;
    private RelativeLayout mLlRightPic;

    public MyTextView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }
    public MyTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }
    public MyTextView(Context context) {
        super(context);
        init(context);
    }
    /**
     * 初始化
     * @param context
     */
    private void init(Context context) {
        if (layout == null)
            layout = (RelativeLayout) ((LayoutInflater) (context.getSystemService(Context.LAYOUT_INFLATER_SERVICE))).
                    inflate(R.layout.my_textview,this);
        mEtPassword = (EditText) layout.findViewById(R.id.et_password);
        mLlRightPic = (RelativeLayout) layout.findViewById(R.id.gy_rl_edittext_right);

        mLlRightPic.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                //右侧图标点击时，切换 显示密码和隐藏密码的设置
            }
        });
    }

    public String getText(){
        //返回用户输入的密码
        return mEtPassword.getEditableText().toString();
    }
}

代码中使用：当做正常控件来使用。

<com.example.yijian.testanination.MyTextView
    android:layout_width="match_parent"
    android:layout_height="60dp">
</com.example.yijian.testanination.MyTextView>

 

2.继承现有控件，实现所需功能。

有些情况下直接继承现有控件，也十分方便。

这种情况要求，对要继承的类较为熟悉。

比如防止Button控件连续点击，可以重写button

/**
 * Created by gj on 2016/5/11.
 * 统一按钮
 */
public class GyButton extends Button {
    public GyButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }
    public GyButton(Context context) {
        super(context);
        init(context);
    }
//button_selecter
    private void init(Context context) {
        setBackgroundDrawable(getResources().getDrawable(R.drawable.button));
        setTextSize(16);
        setTextColor(context.getResources().getColor(R.color.textcolor_on_up_widget));
    }
    @Override
    public boolean performClick() {
        if(DataTimeUtil.buttonIsDoubleClick()){
            return false;
        }else{
            return super.performClick();
        }
    }
}

 

ViewPager添加小圆点指示器

onDraw中去绘制圆点。getAdapter能拿到适配器。getCount可以拿到元素的数量。getCurrentItem当前索引。

这样就可以自动的设置指示器。

/**
 * Created by gj on 2017/2/8.
 */
public class IndicatorViewPager extends ViewPager{

    Context context;
    Paint paint;
    List<Map<String, String>> urls;

    public IndicatorViewPager(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.context = context;
        paint = new Paint();
    }


    public void setData(List<Map<String, String>> data) {
        urls.clear();
        for (int i = 0; i < data.size(); i++) {
            urls.add(data.get(i));
        }
        if(urls.size()>0){
            this.setVisibility(View.VISIBLE);
        }else{
            this.setVisibility(View.GONE);
        }
    }

    @Override
    public void draw(Canvas canvas) {
        super.draw(canvas);
        drawCycle(canvas);
    }

    private void drawCycle(Canvas canvas) {
        canvas.save();
        canvas.translate(getScrollX(), getScrollY());
        int count = 0;
        if (this.getAdapter() != null) {
            count = this.getAdapter().getCount();
        }
        int select = getCurrentItem();
        float density = getContext().getResources().getDisplayMetrics().density;
        int itemWidth = (int) (11 * density);
        int itemHeight = itemWidth / 2;
        int x = (getWidth() - count * itemWidth)/2;
        int y = getHeight() - itemWidth;
        int minItemHeight = (int) ((float) itemHeight * 0.8F);
        paint.setAntiAlias(true);
        paint.setStyle(Paint.Style.FILL);
        for (int i = 0; i < count; i++) {
            if (select == i) {
                paint.setColor(0xFF666666);
                canvas.drawCircle((x + itemWidth * i + itemWidth / 2)+350, y, minItemHeight, paint);
            } else {
                paint.setColor(0xFFe6e6e6);
                canvas.drawCircle((x + itemWidth * i + itemWidth / 2)+350, y, minItemHeight, paint);
            }
        }
        canvas.restore();
    }

}

 

实现文字的垂直滚动效果。

继承TextSwitcher(文字转换器)。即可正常设置文字。

/**
 * 自动垂直滚动的TextView
 */
public class VerticalScrollTextView extends TextSwitcher implements ViewSwitcher.ViewFactory {
    private Context mContext;
    //mInUp,mOutUp分别构成向下翻页的进出动画
    private Animation mInAnimation;
    private Animation mOutAnimation;
    public VerticalScrollTextView(Context context) {
        this(context, null);
    }
    public VerticalScrollTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
        mContext = context;
        init();
    }
    private void init() {
        //设置TextView的产生，会调用ViewFactory.makeView()
        setFactory(this);
        //设置出入动画
        mInAnimation = AnimationUtils.loadAnimation(mContext, R.anim.vertical_in);
        mOutAnimation = AnimationUtils.loadAnimation(mContext, R.anim.vertical_out);
        setInAnimation(mInAnimation);
        setOutAnimation(mOutAnimation);
    }
    //这里返回的TextView，就是我们看到的View,可以设置自己想要的效果
    @Override
    public View makeView() {
        TextView textView = new TextView(mContext);
        textView.setTextSize(36);
//        textView.setSingleLine(true);
//        textView.setGravity(Gravity.CENTER_VERTICAL);
        return textView;
    }
}

动画vertical_in

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
    <translate
        android:duration="1000"
        android:fromYDelta="100%p"
        android:toYDelta="0%p" />
</set>

verrical_out

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
    <translate
        android:duration="1000"
        android:fromYDelta="0%p"
        android:toYDelta="-100%p" />
</set>

 

3.继承View或者ViewGroup

3.1继承View

Values/attrs.xml

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

    <attr name="text"format="string" />
    <attr name="textSize"format="dimension" />

    <declare-styleable name="CustomTxtView">
        <attr name="text"/>
        <attr name="textSize"/>
    </declare-styleable>

</resources> 

 

CustomerView继承成View类

构造方法走三个参数的。

public CustomerView(Context context) {
    this(context,null);
}

public CustomerView(Context context, AttributeSet attrs) {
    this(context, attrs,0);
}

 

public CustomerView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    /**
     * 获得我们所定义的自定义样式属性
     */
    TypedArray a = context.getTheme().obtainStyledAttributes(attrs, R.styleable.CustomTxtView, defStyleAttr, 0);
    int n = a.getIndexCount();

    for (int i = 0; i < n; i++)
    {
        int attr = a.getIndex(i);
        switch (attr)
        {
            case R.styleable.CustomTxtView_text:
                this.text =  a.getString(attr);
                break;
            case R.styleable.CustomTxtView_textSize:
                // 默认设置为16sp，TypeValue也可以把sp转化为px
                mTitleTextSize = a.getDimensionPixelSize(attr, (int) TypedValue.applyDimension(
                        TypedValue.COMPLEX_UNIT_SP, 16, getResources().getDisplayMetrics()));
                break;
        }
    }
    mPaint = new Paint();
    mPaint.setTextSize(mTitleTextSize);

    mBound = new Rect();
    mPaint.getTextBounds(text, 0, text.length(), mBound);

}

 

实现onDraw、onMeasure

@Override
    protected void onDraw(Canvas canvas)
    {
        mPaint.setColor(Color.YELLOW);
        canvas.drawRect(0, 0, getMeasuredWidth(), getMeasuredHeight(), mPaint);

        mPaint.setColor(Color.BLACK);
        canvas.drawText(text, getWidth() / 2 - mBound.width() / 2, getHeight() / 2 + mBound.height() / 2, mPaint);
    }
//    先了解MeasureSpec的specMode,一共三种类型：
//    EXACTLY：一般是设置了明确的值或者是MATCH_PARENT
//    AT_MOST：表示子布局限制在一个最大值内，一般为WARP_CONTENT
//    UNSPECIFIED：表示子布局想要多大就多大，很少使用
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
    {
        int widthMode = MeasureSpec.getMode(widthMeasureSpec);
        int widthSize = MeasureSpec.getSize(widthMeasureSpec);
        int heightMode = MeasureSpec.getMode(heightMeasureSpec);
        int heightSize = MeasureSpec.getSize(heightMeasureSpec);
        int width;
        int height ;
        if (widthMode == MeasureSpec.EXACTLY)
        {
            width = widthSize;
        } else
        {
            mPaint.setTextSize(mTitleTextSize);
            mPaint.getTextBounds(text, 0, text.length(), mBound);
            float textWidth = mBound.width();
            int desired = (int) (getPaddingLeft() + textWidth + getPaddingRight());
            width = desired;
        }

        if (heightMode == MeasureSpec.EXACTLY)
        {
            height = heightSize;
        } else
        {
            mPaint.setTextSize(mTitleTextSize);
            mPaint.getTextBounds(text, 0, text.length(), mBound);
            float textHeight = mBound.height();
            int desired = (int) (getPaddingTop() + textHeight + getPaddingBottom());
            height = desired;
        }
        setMeasuredDimension(width, height);
    }

 

在布局中使用(需要添加约束)

xmlns:customtext="http://schemas.android.com/apk/res-auto"

 

<com.example.yijian.testanination.widget.CustomerView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    customtext:text="12378"
    customtext:textSize="16sp"
    />

 

安卓滚动字幕以及TextSwitcher、ImageSwitcher使用
李彬博客专栏
02-16 6121
安卓字幕滚动，textSwitcher，imageSwitcher
Android 自定义控件的简单实现
冯纫机关枪的博客
10-07 286
组合方式自定义控件
Android自定义组合控件
最新发布
唐诺
05-15 318
Android自定义组合控件
android auto scroll ,AutoVerticalScrollTextView垂直滚动效果,和上下滚动效果
weixin_34547883的博客
05-28 806
布局里面就是两个自定义的TextView,上面的左右滑动的是AutoHorizontalScrollTextView;下面上下滚动的是AutoVerticalScrollTextView; 上面左右滑动的非常好实现，直接把AutoHorizontalScrollTextView复制到项目中，复制全类名到布局文件中，和系统TextView一样，只需设置文本其他什么都不用设置；下面垂直滚动的Auto...
android自定义View-垂直滚动的TextView
专注Android开发
12-26 773
自定义垂直滚动的TextView，主要是用来学习Scroller的使用。关于ScrollTextView的实现，可以看下面的介绍和源码。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 3
android textview循环垂直滚动条,GitHub - shubowen/VerticalRollingTextView: 竖直方向无限循环滚动显示文本的控件...
weixin_33814002的博客
05-25 360
VerticalRollingTextView竖直方向无限循环滚动文本的控件非常轻量级,直接继承View实现使用方法:先在项目build.gradle中添加依赖:compile 'com.xiaosu:VerticalRollingTextView:2.0.9'1.现在布局文件中声明android:layout_width="match_parent"android:layout_height="...
Android自定义控件eBook实现翻书效果实例详解
01-04
本文实例讲述了Android自定义控件eBook实现翻书效果的方法。分享给大家供大家参考，具体如下： 效果图： Book.java文件： package com.book; import android.app.Activity; import android.os.Bundle; import ...
Android 自定义控件 EditText输入框两边加减按钮Button Demo
08-30
在Android开发中，自定义控件是提升应用界面独特性和用户体验的重要手段。本文将深入探讨如何实现一个特定的自定义控件，即“Android 自定义控件 EditText输入框两边加减按钮Button Demo”。这个控件结合了EditText...
Android自定义控件实现不规则区域点击事件
08-27
Android自定义控件实现不规则区域点击事件是Android开发中的一种常见需求，特别是在地图应用、游戏开发等领域。以下是关于Android自定义控件实现不规则区域点击事件的相关知识点： 1. SVG文件解析：在实现不规则...
android实现TextView垂直或水平滚动
weixin_34274029的博客
03-28 125
下面将介绍TextView实现滚动的三种方式： 1、嵌套在ScrollView或者HorizontalScrollView中 垂直滚动：<scrollviewandroid:layout_width="fill_parent" android:layout_height="fill_parent"android:scrollbars="vertical"> <...
Android 自定义控件详解
小旭的专栏
01-09 1494
我们在开发工程中有时系统自带的控件已经满足不了我们的需求，这是我们就需要设计自己的控件。这里给大家介绍一个通用导航栏控件。 一、设计我们在布局文件中所需要使用的属性 1、在res\values文件夹下新建一个atts.xml文件。 2、添加自定义控件中各部分组件的属性，代码如下： ...
Android自定义TextSwitcher实现文本自动垂直滚动
qizhenyibao的博客
06-28 1411
这篇文章主要介绍了Android中TextSwitcher实现垂直滚动效果,需要的朋友可以参考下。XML代码activity_main&lt;?xml version="1.0" encoding="utf-8"?&gt;&lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:la...
Android TextView实现垂直滚动的跑马灯效果
梁超杰
01-18 3933
我们知道TextView水平方向可以设置跑马灯效果，可是垂直方向上需要跑马灯效果该如何设置呢？ 先看下效果图： 附上源码： VerticalScrollTextView package com.android.uilib.view; import android.content.Context; import android.graphics.Color; import andr
垂直滚动的Textview 类似小喇叭通知
默丶
03-28 756
首先将自定义控件导入到项目中 public class AutoVerticalScrollTextView extends TextSwitcher implements ViewSwitcher.ViewFactory { private Context mContext; //mInUp,mOutUp分别构成向下翻页的进出动画 private Rotat
Android 自定义View合集
hjh200507609的专栏
12-08 1917
http://blog.youkuaiyun.com/u011507982/article/details/51199644 自定义控件学习  https://github.com/GcsSloop/AndroidNote/tree/master/CustomView  小良自定义控件合集  https://github.com/Mr-XiaoLiang  自定义控件三部曲  ht
Android自定义控件并且使其可以在xml中自定义属性
XiaoM的专栏
06-12 5852
android自定义View。 介绍了android开发中自定义View的步骤及相关注意事项做了较为详尽的说明。
Android - 自定义控件
搬砖
04-01 4854
Android自定义控件
Android自定义控件开发指南
以下将详细介绍关于Android自定义控件的知识点。 ### 自定义控件基础 #### 1. 自定义控件的分类 自定义控件可以分为两种类型： - **完全自定义控件**：继承自`View`类或其子类，并从零开始实现绘制逻辑。 - **组合...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值