自定义UI模板

自定义模板使用:
1.设置需要的属性
在values文件下定义一个attrs.xml文件

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- telling the system that this is my custom attributes-->
    <declare-styleable name="TopBar">
       <!--use the attr tag to custom the custom attributes-->
        <!--the tag "format" declare the type we will use later in the XML files,here title should be a string-->
        <attr name="title" format="string"/>
        <attr name="titleTextSize" format="dimension"/>
        <attr name="titleTextColor" format="color"/>

        <attr name="leftTextColor" format="color"/>
        <attr name="leftBackground" format="reference|color"/>
        <attr name="leftText" format="string"/>

        <attr name="rightTextColor" format="color"/>
        <attr name="rightBackground" format="reference|color"/>
        <attr name="rightText" format="string"/>
    </declare-styleable>
</resources>

里面的format为attr属性实现的类型,例如title为String。
reference为可应用其他@drawable等类型。
dimension为尺寸大小。

2.实现一个自定义的View

public class TopBar extends RelativeLayout
{
    private Button leftButton,rightButton;
    private TextView titleTextView;
    private int leftTextColor;
    private Drawable leftBackground;
    private String leftText;
    private int rightTextColor;
    private Drawable rightBackground;
    private String rightText;
    private float titleTextsize;
    private int titleTextColor;
    private String title;

    /**
     * 在构造方法中获得自定义的XML属性,并把这些自定义值赋值给空间。
     * @param context
     * @param attrs
     */
    public TopBar(Context context, AttributeSet attrs)
    {
        super(context, attrs);
        //用TypedArray存储自定义属性的值
        TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.TopBar);
        //从TypedArray中获取自定义的值,在此定义的控件类型跟XML文件定义的类型需要一一对应
        leftTextColor = ta.getColor(R.styleable.TopBar_leftTextColor,0);
        leftBackground = ta.getDrawable(R.styleable.TopBar_leftBackground);
        leftText= ta.getString(R.styleable.TopBar_leftText);

        rightTextColor = ta.getColor(R.styleable.TopBar_rightTextColor,0);
        rightBackground = ta.getDrawable(R.styleable.TopBar_rightBackground);
        rightText= ta.getString(R.styleable.TopBar_rightText);

        titleTextsize = ta.getDimension(R.styleable.TopBar_titleTextSize,0);
        titleTextColor = ta.getColor(R.styleable.TopBar_titleTextColor,0);
        title = ta.getString(R.styleable.TopBar_title);
        //使用完TypedArray之后需要进行回收
        ta.recycle();
    }
}

使用获取到的属性值

        leftButton = new Button(context);
        rightButton  = new Button(context);
        tvTitle = new TextView(context);

        leftButton.setTextColor(leftTextColor);
        leftButton.setBackground(leftBackground);
        leftButton.setText(leftText);

        rightButton.setTextColor(rightTextColor);
        rightButton.setBackground(rightBackground);
        rightButton.setText(rightText);

        tvTitle.setTextColor(titleTextColor);
        tvTitle.setTextSize(titleTextsize);
        tvTitle.setText(title);
        tvTitle.setGravity(Gravity.CENTER);

自定义VIew可以算是(组合模式)将组件拼合在一起,形成一个行的控件。

//通过LayoutParams将leftParams定义为一个宽和高都是WRAP_CONTENT的布局参数
        leftParams = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
                ViewGroup.LayoutParams.WRAP_CONTENT);
        //添加规则让该参数ALIGN_PARENT_LEFT
        leftParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT, TRUE);
        //将leftButton以leftParams形式加入到ViewGroup
        addView(leftButton, leftParams);

        rightParams = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
                ViewGroup.LayoutParams.WRAP_CONTENT);
        rightParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, TRUE);
        addView(rightButton, rightParams);

        titleParams = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
                ViewGroup.LayoutParams.MATCH_PARENT);
        titleParams.addRule(RelativeLayout.CENTER_IN_PARENT, TRUE);
        addView(tvTitle, titleParams);

3.在布局文件中引用自定义的View

//自定义View的引用路径
xmlns:connor="http://schemas.android.com/apk/res/com.example.topbar"
.......
<com.example.topbar.TopBar 
        android:id="@+id/topbar"
        android:layout_width="match_parent"
        android:layout_height="40dp"
 //上面是安卓系统的属性定义,下面是自定义布局声明所对应的属性
        connor:leftBackground="@drawable/ic_launcher"
        connor:leftText="Back"
        connor:leftTextColor="#FFFFFF"
        connor:rightBackground="@drawable/ic_launcher"
        connor:rightText="More"
        connor:rightTextColor="#FFFFFF"
        connor:title="自定义标题"
        connor:titleTextSize="10sp"
        connor:titleTextColor="#123412"
        >
 </com.example.topbar.TopBar>

通过XML布局将属性值传递给自定义View,实现模板。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值