android自定义View之复合控件

复合控件可以很好地创建出具有重用功能的控件集合。

很多的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);//只显示左边按钮*/

}

}

这是本人的第一篇博客,如有错漏,请留言指教!

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

以上是 android自定义View之复合控件 的全部内容, 来源链接: utcz.com/p/243640.html

回到顶部