Android 相关自定义View基本知识可以参考 Android View 自定义属性, 本篇博客博主将和大家一起实践Android自定义View,我们知道,在应用中最常见的就是TitleBar,他们形式上保持一致,一般均是左边回退按钮,中间说明文本,右边功能按钮。所以很适合抽取作为自定义View模板,废话少说,直接上干货。
自定义View-attrs
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="TitleBarCustom">
<attr name="center_text" format="string"/>
<attr name="center_size" format="dimension"/>
<attr name="center_color" format="color"/>
<attr name="center_ground" format="reference|color"/>
<attr name="left_text" format="string"/>
<attr name="left_size" format="dimension"/>
<attr name="left_color" format="color"/>
<attr name="left_ground" format="reference|color"/>
<attr name="right_text" format="string"/>
<attr name="right_size" format="dimension"/>
<attr name="right_color" format="color"/>
<attr name="right_ground" format="reference|color"/>
</declare-styleable>
</resources>
自定义View类
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;
public class TitleBar extends RelativeLayout
{
private Button mRightButton, mLeftButton;
private TextView mCenterTextView;
private int mCenterColor, mRightColor, mLeftColor;
private Drawable mCenterBackground, mRightBackground, mLeftBackground;
private float mCenterSize, mRightSize, mLeftSize;
private String mCenterText, mRightText, mLeftText;
public void setOnTitleBarClickListener(OnTitleBarClickListener mOnTitleBarClickListener)
{
this.mOnTitleBarClickListener = mOnTitleBarClickListener;
}
private OnTitleBarClickListener mOnTitleBarClickListener;
public TitleBar(Context context, AttributeSet attrs)
{
super(context, attrs);
final TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.TitleBarCustom);
final int N = a.getIndexCount();
for (int i = 0; i < N; i++)
{
int attr = a.getIndex(i);
switch (attr)
{
case R.styleable.TitleBarCustom_center_color:
mCenterColor = a.getColor(attr, -1);
break;
case R.styleable.TitleBarCustom_center_size:
mCenterSize = a.getDimension(attr, 0);
break;
case R.styleable.TitleBarCustom_center_text:
mCenterText = a.getString(attr);
break;
case R.styleable.TitleBarCustom_center_ground:
mCenterBackground = a.getDrawable(attr);
break;
case R.styleable.TitleBarCustom_left_color:
mLeftColor = a.getColor(attr, -1);
break;
case R.styleable.TitleBarCustom_left_size:
mLeftSize = a.getDimension(attr, 0);
break;
case R.styleable.TitleBarCustom_left_text:
mLeftText = a.getString(attr);
break;
case R.styleable.TitleBarCustom_left_ground:
mLeftBackground = a.getDrawable(attr);
break;
case R.styleable.TitleBarCustom_right_color:
mRightColor = a.getColor(attr, -1);
break;
case R.styleable.TitleBarCustom_right_size:
mRightSize = a.getDimension(attr, 0);
break;
case R.styleable.TitleBarCustom_right_text:
mRightText = a.getString(attr);
break;
case R.styleable.TitleBarCustom_right_ground:
mRightBackground = a.getDrawable(attr);
break;
}
}
mRightButton = new Button(context);
mRightButton.setText(mRightText);
mRightButton.setTextSize(mRightSize);
mRightButton.setTextColor(mRightColor);
mRightButton.setBackgroundDrawable(mRightBackground);
RelativeLayout.LayoutParams rightParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
rightParams.addRule(ALIGN_PARENT_RIGHT, TRUE);
rightParams.addRule(CENTER_VERTICAL, TRUE);
rightParams.setMargins(0, 0, 10, 0);
mRightButton.setLayoutParams(rightParams);
addView(mRightButton);
mRightButton.setOnClickListener(new OnClickListener()
{
@Override
public void onClick(View v)
{
if (mOnTitleBarClickListener != null)
{
mOnTitleBarClickListener.rightButtonClick();
}
}
});
mLeftButton = new Button(context);
mLeftButton.setText(mLeftText);
mLeftButton.setTextSize(mLeftSize);
mLeftButton.setTextColor(mLeftColor);
mLeftButton.setBackgroundDrawable(mLeftBackground);
RelativeLayout.LayoutParams leftParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
leftParams.addRule(ALIGN_PARENT_LEFT, TRUE);
leftParams.addRule(CENTER_VERTICAL, TRUE);
leftParams.setMargins(10, 0, 0, 0);
mLeftButton.setLayoutParams(leftParams);
addView(mLeftButton);
mLeftButton.setOnClickListener(new OnClickListener()
{
@Override
public void onClick(View v)
{
if (mOnTitleBarClickListener != null)
{
mOnTitleBarClickListener.leftButtonClick();
}
}
});
mCenterTextView = new TextView(context);
mCenterTextView.setText(mCenterText);
mCenterTextView.setTextSize(mCenterSize);
mCenterTextView.setTextColor(mCenterColor);
mCenterTextView.setBackgroundDrawable(mCenterBackground);
RelativeLayout.LayoutParams centerParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
centerParams.addRule(CENTER_IN_PARENT, TRUE);
leftParams.setMargins(10, 0, 10, 0);
mCenterTextView.setLayoutParams(centerParams);
addView(mCenterTextView);
a.recycle();
}
@SuppressWarnings("unused")
public void setRightButtonVisiablity(boolean isVisiable)
{
if (mRightButton == null) return;
if (isVisiable)
{
mRightButton.setVisibility(View.VISIBLE);
}
else
{
mRightButton.setVisibility(View.GONE);
}
}
@SuppressWarnings("unused")
public void setLeftButtonVisiablity(boolean isVisiable)
{
if (mLeftButton == null) return;
if (isVisiable)
{
mLeftButton.setVisibility(View.VISIBLE);
}
else
{
mLeftButton.setVisibility(View.GONE);
}
}
@SuppressWarnings("unused")
public void setCenterTextVisiablity(boolean isVisiable)
{
if (mCenterTextView == null) return;
if (isVisiable)
{
mCenterTextView.setVisibility(View.VISIBLE);
}
else
{
mCenterTextView.setVisibility(View.GONE);
}
}
public interface OnTitleBarClickListener
{
void leftButtonClick();
void rightButtonClick();
}
}
使用自定义View
首先在UI中定义
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:linroid="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<studio.neulion.com.tasktest.TitleBar
android:layout_width="match_parent"
android:layout_height="60dp"
linroid:center_color="#FF0000"
linroid:center_text="This is Title"
linroid:center_size="12dp"
linroid:center_ground="#00FF00"
linroid:right_color="#00FF00"
linroid:right_text="Click"
linroid:right_size="10dp"
linroid:right_ground="#0000FF"
linroid:left_color="#0000FF"
linroid:left_text="Back"
linroid:left_size="10dp"
linroid:left_ground="#FF0000"
android:id="@+id/title_bar" />
</LinearLayout>
然后在代码中使用
public class SixActivity extends Activity
{
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_title);
initView();
}
private void initView()
{
final TitleBar titleBar = (TitleBar) findViewById(R.id.title_bar);
if (titleBar != null)
{
titleBar.setOnTitleBarClickListener(new OnTitleBarClickListener()
{
@Override
public void leftButtonClick()
{
Toast.makeText(SixActivity.this, "Left button click!", Toast.LENGTH_LONG).show();
}
@Override
public void rightButtonClick()
{
Toast.makeText(SixActivity.this, "Right button click!", Toast.LENGTH_LONG).show();
}
});
}
}
}
这样就完成了整个TitleBar的自定义View,虽然很粗糙,但是基本的模型已经出来了,这是个典型的组合自定义型View的例子,其他自定义型View后续会更新。
时间: 2024-10-06 10:47:33