Android中全局通用样式定义

对于全局通用样式,有三种自定义方法,分别为自定义view、include方式引用以及在styles中直接定义通用样式。
下面重点介绍一下后两种方法,以登录页面的设计为例。

1 include方式引用

以顶部导航nav_bar(也就是toolbar)为例来进行介绍,有的时候不同界面顶部的导航栏大体框架是相同的,只不过细枝末节处稍有不同,这时可以将其封装便于复用。

  • 分析顶部导航栏布局,在layout文件中新建布局文件,并命名为nav_bar.xml
  • 新建一个BaseActivity.java文件,继承自Activity类,让其他Activity直接继承BaseActivity,在BaseActivity中进行nav_bar的初始化操作

BaseActivity中包含initNavBar方法,用来确定顶部导航栏标题内容,是否显示某些图标等

  • 在登录页面LoginActivity中调用initNavBar方法,传入相应参数(title内容,是否显示某图标)
  • 在登录页面布局文件activity_login.xml中引用nav_bar即可
<include layout="@layout/nav_bar"/>

测试的时候点击登录页面按钮跳转至主界面,主界面顶部导航栏与登录页面不同,以确定成功实现了nav_bar的复用

nav_bar.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="56dp"
    android:background="@color/colorPrimary"
    android:paddingLeft="@dimen/marginSize"
    android:paddingRight="@dimen/marginSize">

    <ImageView
        android:id="@+id/nav_menu"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/menu"
        android:layout_gravity="center_vertical"/>

    <TextView
        android:id="@+id/nav_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="开心就好"
        android:layout_gravity="center"
        android:textSize="@dimen/titleSize"
        android:textStyle="bold"
        android:textColor="@android:color/white"/>

</FrameLayout>

BaseActivity.java

public class BaseActivity extends Activity {

    private ImageView ivMenu;
    private TextView tvTitle;

    /**
     * 初始化nav_bar
     * @param isShowMenu
     * @param title
     */
    protected void initNavBar(boolean isShowMenu,String title){
        ivMenu=findViewById(R.id.nav_menu);
        tvTitle=findViewById(R.id.nav_title);

        ivMenu.setVisibility(isShowMenu? View.VISIBLE:View.GONE);
        tvTitle.setText(title);

    }
}

LoginActivity.java

public class LoginActivity extends BaseActivity {

    private Button commitBtn;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_login);
        initView();
    }

    /**
     * 初始化
     */
    private void initView(){
        initNavBar(false,"登录");
        commitBtn=findViewById(R.id.commit_btn);
        commitBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                toMain();
            }
        });
    }

    /**
     * 跳转至主页面
     */
    private void toMain(){
        Intent intent=new Intent(this,MainActivity.class);
        startActivity(intent);
    }
}

MainActivity.java

public class MainActivity extends BaseActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
    }

    /**
     * 初始化控件
     */
    private void initView(){
        initNavBar(true,"主界面");
    }
}

至此,成功用include引用方法实现了顶部导航栏的复用~

登录页面:

主界面:

2 styles中定义通用样式

下面对登录页面中输入框底下的分割线以及登录按钮样式进行定义。

与其他方法相比,这种方法简单许多,步骤如下:

  • 在res/values目录下的styles.xml文件中定义分割线和按钮样式
<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <!-- 自定义分割线 -->
    <style name="line">
        <item name="android:layout_height">1dp</item>
        <item name="android:layout_width">match_parent</item>
        <item name="android:background">@color/colorLine</item>
        <item name="android:layout_margin">@dimen/marginSize</item>
    </style>

    <!-- 自定义登录按钮 -->
    <style name="commitBtn">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">44dp</item>
        <item name="android:textColor">@android:color/white</item>
        <item name="android:textSize">18sp</item>
        <item name="android:layout_marginLeft">@dimen/marginSize</item>
        <item name="android:layout_marginRight">@dimen/marginSize</item>
        <item name="android:gravity">center</item>
        <item name="android:background">@drawable/btn_commit_select</item>
    </style>

</resources>

这里的button设置了一个点击高亮效果,是通过drawable下新建的selector类型的文件来实现的,可控制view在不同状态下的显示效果

  • 在布局文件中引用通用样式即可
<View style="@style/line" />

<Button
    android:id="@+id/commit_btn"
    style="@style/commitBtn"
    android:text="登录"
    android:layout_marginTop="@dimen/marginSize"/>

好了,成功实现了在style中定义通用样式~

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值