简单的自定义View

2018-12-08  本文已影响0人  向右45

在平常使用控件中,常常会遇到组合控件的使用,如果这种组合控件的使用频率比较多的话,就可以考虑到自定义View了,其实就是将组合控件封装到一个新的View容器中,使用的时候直接使用这个新的容器。

第一步设计自定义属性,根据实际情况,将会用到的属性在attrs.xml中定义出来,如下:

<declare-styleable name="CustomEditTextLogin">

    <attr name="editBackground" format="reference" />

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

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

    <attr name="editHint" format="string" />

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

</declare-styleable>

注:declare-styleable节点只有一个name属性,在获取自定义属性是使用。

attr节点有两个属性name和format,其中name为必填可以自由定义,format用于规定自定义属性的值的类型,有10种类型。 

format的8种类型和对应的声明和赋值例子:

图1

关于format详细的请自行百度。

第二步创建组合控件的xml布局文件,并创建自定义类,继承一个View容器,在其构造方法中,通过AttributeSet attrs参数获取自定义属性,如下:

public class CustomEditTextLogin extends LinearLayout {

    private ImageView iconImg;

    private EditText editText;

    public CustomEditTextLogin(Context context) {

        super(context);

        initViews(context, null);

    }

    public CustomEditTextLogin(Context context, AttributeSet attrs) {

        super(context, attrs);

        initViews(context, attrs);

    }

    public CustomEditTextLogin(Context context, AttributeSet attrs, int defStyleAttr) {

        super(context, attrs, defStyleAttr);

        initViews(context, attrs);

    }

    private void initViews(Context context, AttributeSet attrs) {

        View rootView = LayoutInflater.from(context).inflate(R.layout.layout_custom_edittext_login, this);

        iconImg= rootView.findViewById(R.id.layout_custom_edit_login_img);

        editText= rootView.findViewById(R.id.layout_custom_edit_login_edit);

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

        int backgroundID = typedArray.getResourceId(R.styleable.CustomEditTextLogin_editBackground,

                R.drawable.vector_drawable_svg_login_username);

        //设置背景

        iconImg.setBackgroundResource(backgroundID);

        //设置提示文字

        String hint = typedArray.getString(R.styleable.CustomEditTextLogin_editHint);

        editText.setHint(hint);

        //设置提示文字颜色

        int hintColor = typedArray.getColor(R.styleable.CustomEditTextLogin_editTextColorHint,

                ContextCompat.getColor(context, R.color.text_999999));

        editText.setHintTextColor(hintColor);

        //设置输入文字颜色

        int textColor = typedArray.getColor(R.styleable.CustomEditTextLogin_editTextColor,

                ContextCompat.getColor(context, R.color.text_333333));

        editText.setTextColor(textColor);

        //设置字号(px)

        float textSize = typedArray.getDimension(R.styleable.CustomEditTextLogin_editTextSize,

                16);

        //这里因为上面获取到的是ox所以在设置字号的时候,需要指定单位

        editText.setTextSize(TypedValue.COMPLEX_UNIT_PX,textSize);

        typedArray.recycle();

    }

第三步,使用自定义控件,如下:

<com.view.custom.edittext.CustomEditTextLogin

    android:id="@+id/ac_login_username_custom"

    android:layout_width="@dimen/dp_0"

    android:layout_height="wrap_content"

    android_custom:editHint="@string/login_please_input_username"

    android_custom:editBackground="@drawable/vector_drawable_svg_login_username"

    android_custom:editTextColor="@color/text_333333"

    android_custom:editTextColorHint="@color/text_999999"

    android:layout_marginTop="@dimen/dp_80"

    android_custom:editTextSize="16sp"

    app:layout_constraintTop_toBottomOf="@id/ac_login_title_tv"

    app:layout_constraintLeft_toLeftOf="@id/ac_login_to_register_btn"

    app:layout_constraintRight_toRightOf="@id/ac_login_to_register_btn"/>

注:使用这些自定义属性的需在最外层布局的根节点添加自定义属性引用,如:

图2

到此,自定义组合控件介绍完毕。最后提醒需要注意的地方:

1.自定义属性的format选择类型需正确。

2.在自定义控件的构造方法中,通过LayoutInflater获取View布局时,inflate(int resource,ViewGroup root)的第二个参数填充view容器时切记是this,不可是null,否则无法加载出布局。

3.在通过TypedArray获取自定义属性值时,如果是dimension(dp、px、sp等),最终获取到的是float,是像素单位。所以在给控件赋值时,则需指定参数单位,如:editText.setTextSize(TypedValue.COMPLEX_UNIT_PX,textSize);

4.在TypeArray使用结束后别忘了回收,typedArray.recycle();

上一篇下一篇

猜你喜欢

热点阅读