我们所用的所有控件都是直接或间接继承自View的,所用的所有布局都是直接或间接继承自ViewGroup的,View是Android中的一种最基本的UI组件,它可以在屏幕上绘制一块矩形区域,并能响应这块区域的各种事件,因此,我们使用各种控件其实就是在View的基础之上又添加了各自的功能。而ViewGroup则是一种特殊的View,它可以包含很多的子View和子ViewGroup,是一个放置控件和布局的容器。
- 掌握如何自定义控件属性
- 掌握如何动态创建组件
- 掌握如何设计动态模板
- 体会模板化开发的便利之处
- 体会接口回调机制的思想
系统是怎么做的呢
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity">
</LinearLayout>
public class LinearLayout extends ViewGroup {}
可以看出LinearLayout继承自ViewGroup。
步骤
- 设计需要的属性
- 实现自定义View
- 引用自定义View
下面我们来具体看一下实现:
首先我们定义attrs.xml文件来设计我们需要的属性
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="TopBar">
<attr name="titleContent" 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:表示我们在布局文件中引用属性时所需要数据的类型。
接下来我们来实现自定义的View:
package com.timosang.titlebar;
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.view.ViewGroup;
import android.widget.Button;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;
/**
* Created by Administrator on 2015/7/7 0007.
*/
public class TopBar extends RelativeLayout {
//声明所需要的控件
private Button leftButton, rightButton;
private TextView tvTitle;
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 titleContext;
//设置布局参数
private LayoutParams leftParams, rightParams, titleParams;
private topbarClickListener listener;
//定义接口回调
public interface topbarClickListener {
public void leftClick();
public void rightCLick();
}
public void setOnTopbarClickListener(topbarClickListener listener) {
this.listener = listener;
}
public TopBar(final Context context, AttributeSet attrs) {
super(context, attrs);
//获取我们定义的属性
TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.TopBar);
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);
titleContext = ta.getString(R.styleable.TopBar_titleContent);
titleTextSize = ta.getDimension(R.styleable.TopBar_titleTextSize, 0);
titleTextColor = ta.getColor(R.styleable.TopBar_titleTextColor, 0);
//注意要回收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.setText(titleContext);
tvTitle.setTextColor(titleTextColor);
tvTitle.setTextSize(titleTextSize);
tvTitle.setGravity(Gravity.CENTER);
setBackgroundColor(0xFFF09563);
leftParams = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
leftParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT, TRUE);
//把leftButton以leftParams的形式添加到ViewGroup
addView(leftButton, leftParams);
rightParams = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
rightParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, TRUE);
//把rightButton以rightParams的形式添加到ViewGroup
addView(rightButton, rightParams);
titleParams = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.MATCH_PARENT);
titleParams.addRule(RelativeLayout.CENTER_IN_PARENT);
addView(tvTitle, titleParams);
leftButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
//Toast.makeText(context, "left Button", Toast.LENGTH_SHORT).show();
listener.leftClick();
}
});
rightButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
//Toast.makeText(context, "right Button", Toast.LENGTH_SHORT).show();
listener.rightCLick();
}
});
}
public void setLeftIsVisiable(boolean flag) {
if (flag){
leftButton.setVisibility(View.VISIBLE);
}else {
leftButton.setVisibility(View.GONE);
}
}
}
引用我们定义的View:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:custom="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.timosang.titlebar.TopBar
android:id="@+id/top_bar"
android:layout_width="wrap_content"
android:layout_height="50dp"
custom:leftText="back"
custom:leftBackground="#111111"
custom:leftTextColor="#FFFFFF"
custom:rightText="more"
custom:rightBackground="#111111"
custom:rightTextColor="#FFFFFF"
custom:titleContent="自定义标题"
custom:titleTextColor="#FFFFFF"
custom:titleTextSize="10sp">
</com.timosang.titlebar.TopBar>
</LinearLayout>
Activity的实现:
package com.timosang.titlebar;
import android.app.Activity;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.Window;
import android.widget.LinearLayout;
import android.widget.Toast;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
TopBar topBar = (TopBar) findViewById(R.id.top_bar);
topBar.setOnTopbarClickListener(new TopBar.topbarClickListener() {
@Override
public void leftClick() {
Toast.makeText(MainActivity.this, "left Button", Toast.LENGTH_SHORT).show();
}
@Override
public void rightCLick() {
Toast.makeText(MainActivity.this, "right Button", Toast.LENGTH_SHORT).show();
}
});
topBar.setLeftIsVisiable(false);
}
}