很多的APP都有一些共通的UI界面，为了统一应用程序的风格，下面我们就以一个Topbar为实例讲解复合控件。
实现效果如图：
第一步：定义属性
在res资源目录的values目录下创建一个attrs.xml属性定义文件，为一个View提供可自定义的属性。
代码中，通过标签声明了自定义属性，并通过name属性来确定引用的名称。
<?xml version="1.0" encoding="utf-8"?> <resources>
<declare-styleable name="TopBar">
<attr name="titleText" format="string"/>
<attr name="titleSize" format="dimension"/>
<attr name="titleTextColor2" 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>
第二步：创建自定义控件—-创建类CompositControlDemo01，并让其继承RelativeLayout
package com.wjc.customwidget_0502; import android.content.Context; import android.content.res.TypedArray; import android.graphics.drawable.Drawable; import android.util.AttributeSet; import android.view.Gravity; import android.view.View; import android.widget.Button; import android.widget.RelativeLayout; import android.widget.TextView; /** * Created by admin on 2016/5/2. */ public class CompositControlDemo01 extends RelativeLayout { //定义与attrs.xml中的自定义属性对应的属性 private int mLeftTextColor; private String mLeftText; private Drawable mLeftBackground; private int mRightTextColor; private String mRightText; private Drawable mRightBackgound; private String mTitle; private float mTitleTextSize; private int mTitleTextColor; //布局参数 private LayoutParams mLeftParame; private LayoutParams mRightParame; private LayoutParams mTitleParame; //定义显示的布局 private Button mLeftButton; private Button mRightButton; private TextView mTitleView; //定义一个公共接口 private topbarClickListener mListener; //构造函数，attrs就是布局文件传过来的对应的属性 public CompositControlDemo01(Context context, AttributeSet attrs) { super(context, attrs); initAttrs(context, attrs); initView(context); } //将attrs.xml中定义的属性值存入typedArray中 public void initAttrs(Context context, AttributeSet attrs) { TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.TopBar); mLeftTextColor = ta.getColor(R.styleable.TopBar_leftTextColor, 0); mLeftText = ta.getString(R.styleable.TopBar_leftText); mLeftBackground = ta.getDrawable(R.styleable.TopBar_leftBackground); mRightTextColor = ta.getColor(R.styleable.TopBar_rightTextColor, 0); mRightText = ta.getString(R.styleable.TopBar_rightText); mRightBackgound = ta.getDrawable(R.styleable.TopBar_rightBackground); mTitle = ta.getString(R.styleable.TopBar_titleText); mTitleTextSize = ta.getDimension(R.styleable.TopBar_titleSize, 10); mTitleTextColor = ta.getColor(R.styleable.TopBar_titleTextColor2, 0); ta.recycle();//避免重新创建时的错误 } //组合控件，并将属性分配给他们,并设置监听事件 public void initView(Context context) { mLeftButton = new Button(context); mRightButton = new Button(context); mTitleView = new TextView(context); mLeftButton.setTextColor(mLeftTextColor); mLeftButton.setText(mLeftText); mLeftButton.setBackground(mLeftBackground); mRightButton.setTextColor(mRightTextColor); mRightButton.setText(mRightText); mRightButton.setBackground(mRightBackgound); mTitleView.setTextColor(mTitleTextColor); mTitleView.setText(mTitle); mTitleView.setTextSize(mTitleTextSize); mTitleView.setGravity(Gravity.CENTER); //为元素设定相应的布局参数 mLeftParame = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT); mLeftParame.addRule(RelativeLayout.ALIGN_PARENT_LEFT, TRUE); addView(mLeftButton, mLeftParame); mRightParame = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT); mRightParame.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, TRUE); addView(mRightButton, mRightParame); mTitleParame = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT); mTitleParame.addRule(RelativeLayout.CENTER_IN_PARENT, TRUE); addView(mTitleView, mTitleParame); //按钮的点击事件，不需要具体的实现 //只需调用者接口的方法，回调的时候，会有具体的实现 mLeftButton.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { mListener.leftClick(); } }); mRightButton.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { mListener.rightClick(); } }); } //定义接口 //接口对象，实现回调机制，在回调方法中，通过映射的接口对象调用接口的方法 //而不用去考虑如何实现，具体的实现由调用者去创建 public interface topbarClickListener { void leftClick(); void rightClick(); } //暴露一个方法给调用者来注册接口回调 //通过接口来获取回调者对接口方法的实现 public void setOnTopbarClickListener(topbarClickListener mListener) { this.mListener = mListener; } /** * 设置按钮的显示与否通过id区分按钮，flag区分是否显示 * * @param id id * @param flag is Visable？ */ public void setButtonVisable(int id, boolean flag) { if (flag) { if (id == 0) { mLeftButton.setVisibility(View.VISIBLE); } else { mRightButton.setVisibility(View.VISIBLE); } } else { if (id == 0) { mLeftButton.setVisibility(View.GONE); } else { mRightButton.setVisibility(View.GONE); } } } }
第三步：引用UI模板—创建topbar.xml文件
<?xml version="1.0" encoding="utf-8"?>
<com.wjc.customwidget_0502.CompositControlDemo01
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:id="@+id/topBar"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:padding="5dp"
android:background="#3F7EA4"
custom:leftBackground="@drawable/chevron_left"
custom:leftTextColor="#ff00"
custom:leftText="返回"
custom:rightText="更多"
custom:rightTextColor="#ff00"
custom:rightBackground="#ffccff"
custom:titleText="自定义标题"
custom:titleTextColor2="#555555"
custom:titleSize="10sp"
>
</com.wjc.customwidget_0502.CompositControlDemo01>
注：代码中
xmlns:android=http://schemas.android.com/apk/res/android
表示：引用android系统的属性，而
xmlns:custom=http://schemas.android.com/apk/res-auto
表示：引用第三方控件的属性，即引用自定义的属性
通过如上的代码，我们就可以在其他的布局文件中，直接带调用标签来引用这个UI模板View，代码如下
<include layout="@layout/topbar"/>
第四步：实现接口回调——即写一个activity引用此布局
package com.wjc.customwidget_0502;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
CompositControlDemo01 mTopbar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mTopbar=(CompositControlDemo01)findViewById(R.id.topBar);//初始化组合控件
//为topBar中的按钮注册监听事件
mTopbar.setOnTopbarClickListener(new CompositControlDemo01.topbarClickListener() {
@Override
public void leftClick() {
Toast.makeText(MainActivity.this, "back", Toast.LENGTH_SHORT).show();
}
@Override
public void rightClick() {
Toast.makeText(MainActivity.this,"more",Toast.LENGTH_LONG).show();
}
});
/* //是否显示相应的按钮
mTopbar.setButtonVisable(0,true);//只显示左边按钮*/
}
}
这是本人的第一篇博客，如有错漏，请留言指教！
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持华域联盟。
声明：本站（华域联盟www.cnhackhy.com）所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
评论(0)