MaterialTest实习笔记(一)感谢郭神
自定义标题Toolbar实现
使用Toolbar的原因有三:
1. ActionBar在各个安卓版本和定制Rom中的效果表现不一,无法统一。
2. Toolbar可以调整导航状态栏的颜色。
3. ActionBar只能用于顶部而Toolbar它可以还底部顶部使用。
下面是具体实现过程
第一步设置自定义标题的主题theme
首先新建一个空白项目moudle sidebartest,打开AndroidManifest.xml文件,在以下代码中的theme可以看到我们的主题是@style/AppTheme
c
将鼠标放在其上,按住cntrl左键点击一下,跳转到AppTheme的详细属性,或者打开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>
</resources>
我们通过为使Toolbar替代ActionBar要指定parent中不带有ActionBar主题,这里我们设置parent= “Theme.AppCompat.Light.NoActionBar”其中item name为colorPrimary的颜色为标题Toolbar的背景颜色,代码如下。
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
</resources>
此时运行moudle会发现界面顶部一片白,这是因为我们取消了ActionBar的主题,如下图所示:
第二步 修改布局文件
修改activity_main.xml代码,如下所示:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
android:background="@color/colorPrimary"
app:titleTextColor="@color/colorRed"
/>
<!--其中的 app:titleTextColor="@color/colorRed"是我自己在color中设置了颜色属性值为#F00-->
<!--其中的 android:layout_height="?attr/actionBarSize"表示覆盖ActionBar的高度-->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
第三步 添加Java代码
import android.os.Build;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
private android.support.v7.widget.Toolbar toolbar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = findViewById(R.id.toolbar);
}
@Override
protected void onStart() {
super.onStart();
toolbar.setLogo(R.drawable.icon);//设置图片logo,你可以添加自己的图片
toolbar.setTitle("主标题");
toolbar.setSubtitle("副标题");
setSupportActionBar(toolbar);
}
}
运行结果如下图示,此时已经简单实现自定义Toolbar标题栏了。
下一篇将会讲解侧滑菜单栏的实现。