十、自定义标题栏

╰+攻爆jí腚メ 2022-09-25 05:14 247阅读 0赞

应用中的标题栏都是统一风格的，为了方便使用，我们统一封装自定义标题栏控件，主要用到自定义属性的内容。

标题栏的java代码：

public class TitleBarView extends RelativeLayout{
    
        private TextView leftTextView;
        private TextView titleTextView;
        private TextView rightTextView;
    
        public TitleBarView(Context context) {
            this(context, null);
        }
    
        public TitleBarView(Context context, AttributeSet attrs) {
            this(context, attrs, 0);
        }
    
        public TitleBarView(Context context, AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
            LayoutInflater.from(context).inflate(R.layout.title_bar, this, true);
            initView();
            // 获取自定义属性
            TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.TitleBarView);
            // 设置自定义text
            leftTextView.setText(ta.getString(R.styleable.TitleBarView_leftText));
            titleTextView.setText(ta.getString(R.styleable.TitleBarView_titleText));
            rightTextView.setText(ta.getString(R.styleable.TitleBarView_rightText));
            // 设置自定义drawable
            Drawable drawable = ta.getDrawable(R.styleable.TitleBarView_leftDrawable);
            if (drawable != null) {
                leftTextView.setCompoundDrawables(drawable, null, null, null);
            }
            drawable = ta.getDrawable(R.styleable.TitleBarView_rightDrawable);
            if (drawable != null) {
                rightTextView.setCompoundDrawables(null, null, null, drawable);
            }
            ta.recycle();
        }
    
        private void initView() {
            leftTextView = (TextView) findViewById(R.id.tv_left);
            titleTextView = (TextView) findViewById(R.id.tv_title);
            rightTextView = (TextView) findViewById(R.id.tv_right);
    
            leftTextView.setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View v) {
                    if (getContext() instanceof Activity) {
                        ((Activity)getContext()).finish();
                    }
                }
            });
        }
    }

引用到的xml布局：

<?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="@dimen/titlebar_height"
        android:background="@color/titlebar_color">
    
        <TextView
            android:id="@+id/tv_left"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginLeft="@dimen/margin_default"
            android:text="返回"
            android:textColor="@color/font_white"
            android:textSize="@dimen/font_small"
            />
    
        <TextView
            android:id="@+id/tv_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:layout_marginLeft="@dimen/margin_default"
            android:text="标题"
            android:textColor="@color/font_white"
            android:textSize="@dimen/font_middle"
            />
    
        <TextView
            android:id="@+id/tv_right"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_alignParentRight="true"
            android:layout_marginRight="@dimen/margin_default"
            android:text="功能"
            android:textColor="@color/font_white"
            android:textSize="@dimen/font_small"
            />
    
    </RelativeLayout>

布局文件主要包含3个控件，分别是在中间的标题栏文字，左边的返回文字（图片），右边的功能文字（图片）。

在values/attrs.xml中自定义的属性，我们在使用自定义控件的时候，要用到这些自定义属性：

<declare-styleable name="TitleBarView">
            <attr name="leftText" format="string|reference" />
            <attr name="leftDrawable" format="reference" />
            <attr name="titleText" format="string|reference" />
            <attr name="rightText" format="string|reference" />
            <attr name="rightDrawable" format="reference" />
        </declare-styleable>

注意：自定义属性的的name必须和自定义控件的名字一样（都是TitleBarView），不然在使用自定义属性的时候，IDE不会自动提示。

使用自定义控件：

<?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:keng="http://schemas.android.com/apk/res-auto"
        style="@style/match_match">
    
        <com.hy.keng.ui.view.TitleBarView
            android:id="@+id/title_bar"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            keng:leftText="返回"
            keng:titleText="主页"
            keng:rightText="签到"
            />
    
    </RelativeLayout>

可以看到我使用了自定义的3个属性。

效果图如下：

![Center][]

参考：

[http://blog.csdn.net/lmj623565791/article/details/45022631][http_blog.csdn.net_lmj623565791_article_details_45022631]

[安卓自定义属性，Android studio无法提示，只提示3个 ][Android studio_3_]

[Center]: /images/20220718/45a0b742163c4d06bc3c6175b73419e2.png
[http_blog.csdn.net_lmj623565791_article_details_45022631]: http://blog.csdn.net/lmj623565791/article/details/45022631
[Android studio_3_]: http://cache.baiducontent.com/c?m=9f65cb4a8c8507ed4fece7631046893b4c4380146d96864968d4e414c42246020471e4cf27281b03d1c77e621cfc091ab1a168252a5577f1c893d60bc0bc902d2b8a21327b08c31c528516fc9710659c7bc64de9de0e91bfe74495b9d3a3c82457dd200f6df6f09c2d0703cb1fe76542f4d29f5f635d07cceb27648f4e0729885330a14689f7431f10f6f5ca2d3fd45aa7&p=882a9645d6831cfe0be2962a544a9c&newp=8b2a9715d9c041af4eb7f8274a5f93231610db2151d1d001298ffe0cc4241a1a1a3aecbf26211400d5c47c6100ad4a5eeafb3777330034f1f689df08d2ecce7e&user=baidu&fm=sc&query=android+%D7%D4%B6%A8%D2%E5%CA%F4%D0%D4%B2%BB%CC%E1%CA%BE&qid=9ca9aad80010a3be&p1=4