文档库

最新最全的文档下载
当前位置:文档库 > 自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

自定义控件系列之应用篇——自定义标题栏控件

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

通过之前的应用练习其实我们已经对自定义控件有了一定的掌握(查看自定义控件系列其余文章:基础篇、应用篇之圆形进度条),但还是要不断做一些应用锻炼思维和熟练度,接下来我们再运用自定义控件编写一个新闻列表的标题栏,该标题栏控件有三种样式,效果如图所示:

样式1:

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

样式2:

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

样式3:

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

并且标题文字、左右图标可自由变换。实现步骤如下:

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

public class HeaderView extends LinearLayout {

private LayoutInflater mInflater;

private View mHeader;

private LinearLayout mLayoutLeftContainer;//HeaderView控件左侧容器

private LinearLayout mLayoutRightContainer;//HeaderView控件右侧容器

private TextView mTitle;//标题

private LinearLayout mLayoutRightImageButtonLayout;//右侧按钮布局

private ImageButton mRightImageButton;//右侧按钮

//右侧按钮监听接口

private onRightImageButtonClickListener mRightImageButtonClickListener; //左侧按钮布局

private LinearLayout mLayoutLeftImageButtonLayout;

//左侧按钮

private ImageButton mLeftImageButton;

//左侧按钮监听接口

private onLeftImageButtonClickListener mLeftImageButtonClickListener;

public enum HeaderStyle {// 头部整体样式

DEFAULT_TITLE,TITLE_LIFT_IMAGEBUTTON,TITLE_RIGHT_IMAGEBUTTON, TITLE_DOUBLE_IMAGEBUTTON;

}

public HeaderLayout(Context context) {

super(context);

init(context);

}

public HeaderLayout(Context context, AttributeSet attrs) {

super(context, attrs);

init(context);

}

//实现初始化,加载布局文件

public void init(Context context) {

mInflater = LayoutInflater.from(context);

mHeader = mInflater.inflate(http://www.wendangku.net/doc/f95478a876eeaeaad0f33021.htmlmon_headerbar, null);

addView(mHeader);

initViews();

}

//初始化控件

public void initViews(){

mLayoutLeftContainer

= (LinearLayout) findViewByHeaderId(R.id.header_layout_leftview_container); mLayoutRightContainer

=(LinearLayout)findViewByHeaderId(R.id.header_layout_rightview_container); mHtvSubTitle = (TextView) findViewByHeaderId(R.id.header_htv_subtitle);

}

public View findViewByHeaderId(int id) {

return mHeader.findViewById(id); }

//设置控件样式

public void initStyle(HeaderStyle hStyle) {

switch (hStyle) {

case DEFAULT_TITLE:

defaultTitle();

break;

case TITLE_LIFT_IMAGEBUTTON:

defaultTitle();

titleLeftImageButton();

break;

case TITLE_RIGHT_IMAGEBUTTON:

defaultTitle();

titleRightImageButton();

break;

case TITLE_DOUBLE_IMAGEBUTTON:

defaultTitle();

titleLeftImageButton();

titleRightImageButton();

break;

}

}

// 默认文字标题

private void defaultTitle() {

mLayoutLeftContainer.removeAllViews();

mLayoutRightContainer.removeAllViews();

}

// 左侧自定义按钮

private void titleLeftImageButton() {

View mleftImageButtonView=

mInflater.inflate(http://www.wendangku.net/doc/f95478a876eeaeaad0f33021.htmlyout.include_header_imagebutton, null); mLayoutLeftContainer.addView(mleftImageButtonView);

mLayoutLeftImageButtonLayout =

(LinearLayout)mleftImageButtonView.findViewById(R.id.header_layout_imagebuttonlayou t);

mLeftImageButton =

(ImageButton)mleftImageButtonView.findViewById(R.id.header_ib_imagebutton); mLayoutLeftImageButtonLayout.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View arg0) {

if (mLeftImageButtonClickListener != null) {

//回调方法,调用onLeftImageButtonClickListener接口实现类的方法

mLeftImageButtonClickListener.onClick();

}

}

});

}

// 右侧自定义按钮

private void titleRightImageButton() {

View mRightImageButtonView

= mInflater.inflate(http://www.wendangku.net/doc/f95478a876eeaeaad0f33021.htmlyout.include_header_imagebutton, null); mLayoutRightContainer.addView(mRightImageButtonView); mLayoutRightImageButtonLayout =

(LinearLayout)mRightImageButtonView.findViewById(R.id.header_layout_imagebuttonlayo ut);

mRightImageButton =

(ImageButton)mRightImageButtonView.findViewById(R.id.header_ib_imagebutton); mLayoutRightImageButtonLayout.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View arg0) {

if (mRightImageButtonClickListener != null) {

//回调方法,调用onRightImageButtonClickListener接口实现类的方法

mRightImageButtonClickListener.onClick();

}

}

});

}

public void setDefaultTitle(CharSequence title) {

if (title != null) {

mHtvSubTitle.setText(title);

} else {

mHtvSubTitle.setVisibility(View.GONE);

}

}

//重要目的是设置右侧按钮侦听接的实现类,还包括了标题文本、按钮图片public void setTitleAndRightImageButton(CharSequence title, int id,

onRightImageButtonClickListener onRightImageButtonClickListener) { setDefaultTitle(title);

if (mRightImageButton != null && id > 0) {

mRightImageButton.setImageResource(id);

setOnRightImageButtonClickListener(onRightImageButtonClickListener); }

}

//重要目的是左侧按钮设置侦听接的实现类还包,括了标题文本、按钮图片public void setTitleAndLeftImageButton(CharSequence title, int id,

onLeftImageButtonClickListener listener) {

setDefaultTitle(title);

if (mLeftImageButton != null && id > 0) {

mLeftImageButton.setImageResource(id);

setOnLeftImageButtonClickListener(listener);

}

}

public void setOnRightImageButtonClickListener(

onRightImageButtonClickListener listener) {

mRightImageButtonClickListener = listener;

}

//设置右侧按钮监听接口

public interface onRightImageButtonClickListener {

void onClick();

}

public void setOnLeftImageButtonClickListener(

onLeftImageButtonClickListener listener) {

mLeftImageButtonClickListener = listener;

}

//设置左侧按钮监听接口

public interface onLeftImageButtonClickListener {

void onClick();

}

}

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

android:layout_height="54dip"

android:background="#ff0000"

android:baselineAligned="false"

android:focusable="true"

android:gravity="center_vertical"

android:orientation="horizontal">

android:id="@+id/header_layout_leftview_container"

android:layout_width="wrap_content"

android:layout_height="fill_parent"

android:layout_alignParentLeft="true"

android:gravity="center_vertical|left"

android:orientation="horizontal">

android:id="@+id/header_layout_middleview_container"

android:layout_width="wrap_content"

android:layout_height="fill_parent"

android:gravity="center"

android:layout_centerHorizontal="true"

android:layout_centerVertical="true"

android:orientation="horizontal">

android:id="@+id/header_htv_subtitle"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="@string/app_name"

android:textColor="#FCFCFC"

android:textSize="22sp"/>

android:id="@+id/header_layout_rightview_container"

android:layout_width="wrap_content"

android:layout_height="fill_parent"

android:layout_alignParentRight="true"

android:gravity="center_vertical|right"

android:orientation="horizontal">

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

通过LayoutInflater的inflate方法,如:View mRightImageButtonView =mInflater.inflate(http://www.wendangku.net/doc/f95478a876eeaeaad0f33021.htmlyout.include_header_imagebutton, null)获得布局

android:id="@+id/header_layout_imagebuttonlayout"

android:layout_width="wrap_content"

android:layout_height="fill_parent"

android:background="@drawable/bg_header_defaul"

android:clickable="true"

android:focusable="true"

android:gravity="center"

android:minWidth="54dip"

android:padding="6dip">

android:id="@+id/header_ib_imagebutton"

android:layout_width="35dip"

android:layout_height="35dip"

android:background="#00000000"

android:clickable="false"

android:focusable="false"

android:contentDescription="@string/app_name"

android:scaleType="centerInside"/>

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

public class MainActivity extends Activity {

private HeaderView mHeaderView;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(http://www.wendangku.net/doc/f95478a876eeaeaad0f33021.htmlyout.activity_main);

initViews();

}

protected void initViews(){

mHeaderView = (HeaderView )findViewById(R.id.otherfeedlist_header); mHeaderView.initStyle(HeaderStyle.TITLE_DOUBLE_IMAGEBUTTON);

//设置左侧按钮,参数依次为标题文本、图片、左侧按钮侦听类

mHeaderView.setTitleAndLeftImageButton("新闻头条",

http://www.wendangku.net/doc/f95478a876eeaeaad0f33021.htmlm_new_home_index_user_normal, leftButtonClickListener);

//设置右侧按钮,参数依次为标题文本、图片、右侧按钮侦听类

mHeaderView.setTitleAndRightImageButton("新闻头条",

http://www.wendangku.net/doc/f95478a876eeaeaad0f33021.htmlm_new_home_index_home_normal, rightButtonClickListener);

}

//实现HeadView组件的左侧按钮侦听接口

private onLeftImageButtonClickListener leftButtonClickListener=

new onLeftImageButtonClickListener() {

public void onClick() {

Toast.makeText(getApplicationContext(), "您点击了左侧按钮!", Toast.LENGTH_SHORT).show();

}

};

//实现HeadView组件的右侧右侧侦听接口

private onRightImageButtonClickListener rightButtonClickListener=

new onRightImageButtonClickListener() {

public void onClick() {

Toast.makeText(getApplicationContext(), "您点击了右侧按钮!", Toast.LENGTH_SHORT).show();

}

};

}

自定义控件系列之应用篇——自定义标题栏控件(烟台杰瑞教育Android培训部原创)

xmlns:tools="http://www.wendangku.net/doc/f95478a876eeaeaad0f33021.html/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical">

android:id="@+id/otherfeedlist_header"

android:layout_width="fill_parent"

android:layout_height="54dip">