在移动应用程序中,Toolbar是一个非常常用的控件,它作为应用程序的导航栏和工具栏。在Material Design中,Toolbar被重点推荐使用,并且应用于大量的界面设计中。其中,一个常见的问题是如何使得标题能够居中显示,这里通过具体的代码展示如何实现。
1. 使用AppCompatActivity
在实现Toolbar中标题居中显示之前,我们需要先确保我们使用的是AppCompatActivity
。
public class MainActivity extends AppCompatActivity { //... 省略代码 }
2. 定义Toolbar
在xml文件中,定义我们的Toolbar布局
<android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary"> </android.support.v7.widget.Toolbar>
3. 实现标题居中显示
无论是在Toolbar的xml布局中还是代码中,都很难实现标题居中显示的效果。因此,我们需要添加样式来实现这一目标。
-- -------------------- ---- ------- ------ ------------------- -------------------------------------------------------------- ----- ----------------------------------- ----- ---------------------------------------------------- ----- ---------------------------------------------------------------------- -------- ------ ---------------------------------- ----- ----------------------------------- ----- ---------------------------------------------------- --------
在styles.xml文件中定义我们的样式。
4. 在代码中实现
-- -------------------- ---- ------- ------- ------- - --------------------------- ----------------------------- ------------------------------------------------------------------------------ --------------------------------------- --------------------- -------- ------------ - --------------------------------- ---------------------------------------- ----------------------------- ---------------------------------------
在代码中找到我们定义的Toolbar,设置我们的样式和属性。在这里,我们通过Toolbar.setTitle
方法配合在xml中定义的样式来隐藏原生的标题,然后定义一个新的TextView
来替代之前的标题,并通过在xml中定义的样式来实现居中显示。
5. 示例代码
完整的示例代码如下所示:
-- -------------------- ---- ------- ---------------------------------- ------------------------- ----------------------------------- ------------------------------------------- ---------------------------------------- --------- ------------------------------- ----------------------------------- ------------------------------------ ------------------------------- ------------------------ -- ------------------------------------
-- -------------------- ---- ------- ------ ----- ------------ ------- ----------------- - --------- --------- ---- --------------- ------------------- - ----------------------------------- --------------------------------------- ------- ------- - --------------------------- ----------------------------- ------------------------------------------------------------------------------ --------------------------------------- --------------------- -------- ------------ - --------------------------------- ---------------------------------------- ----------------------------- --------------------------------------- - -
6. 总结
本文对Material Design下Toolbar中如何实现标题居中的细节进行了详细的讲解,并且通过具体代码完成了如何居中显示标题的实现。读者可以直接使用本文的代码示例应用于自己的项目中。同时,也可以通过本文中的思路进行修改和优化,实现更符合自己实际需要的效果。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/65921db0eb4cecbf2d703f65