为Toolbar增加文字域
从设计图来看,我们需要居中显示的标题文字:

然而Toolbar的文字默认是左对齐的,其文字大小也比较别扭。我们只能自己为Toolbar添加新的文本视图作为标题。从效果图看来,标题文字主要用来显示当前地点的位置信息,其中第一行为主标题,显示最基本的位置信息,字体较大,颜色较亮;第二行为副标题,显示当前位置所隶书的各级行政区划和国家,使用较暗的颜色,较小的字体。我们分别用颜色主题中已经定义好的主文字色和次级文字色来设置它们。
打开res/layout/activity_main.xml
文件,在Toolbar
单元内部首先新增一个垂直方向的LinearLayout
:

参数如图所示。其中:
-
android:orientation
:指定LinearLayout
内部各元素的排列方向,设为vertical
(垂直) -
android:gravity
:该布局本身与上级布局的对齐方式,设为center
以居中 -
android:layout_gravity
:内部各元素的对齐方式,设置为center
以居中
接下来分别添加主、副标题对应的文本域,并设置各自的id和格式:

其中专门为主标题文本视图(tv_address_1
)设置了较大的字体(20sp
);两个视图分别预填了样例文字,这些文字将来会在程序运行中被实际的位置信息替换。
还有点工作要做——Toolbar自带的标题文字需要隐藏起来。回到MainActivity.java
,添加下列标红的代码:

运行程序查看效果:

接下来增加右端的“+”图标按钮。
本小节涉及修改的文件:
modified: app/src/main/java/com/dmtech/iw/MainActivity.java
modified: app/src/main/res/layout/activity_main.xml
网友评论