零基础美化篇之QQ系列-006-导航按钮绑定页面

admin

1.布局设置
接上节，这里首先设置一个分割线效果
这里就不具体操作了，大家可以思考一下。应该怎么去设置
提供思路是用基础元素：宽度=填充父，高度=1。设计背景编辑器
分割线后面添加布局元素，布局宽度=填充父，布局高度=占用剩余(记得先设置好最后一个布局后在设置这里的占用剩余，主要是如果先设置了占用剩余。对后面的元素设置时会不友好)
继续添加一个分割条
最后添加一个布局：布局宽度=填充父，布局高度=50
效果如图：


2.添加2个布局页面
点击导航按钮的页面布局，在这里添加两个布局。此时注意看文档大纲的结构


是不是发现变成了子级了？该怎么办呢？不要慌(这里我设置了布局元素的离开状态背景，便于查看)


选择子级进行拖动即可调整它的层次关系，是不是很简单。当然还有其他方法

选择刚刚添加的导航布局页面，分别设置好ID，如下图的文本大纲
然后对导航按钮分别绑定元素就是刚才设置的布局页面ID，对应导航按钮绑定ID即可

最后对消息页面和空间页面进行设置
布局-项：布局宽度=填充父，布局高度=占用剩余
好了，预览点击导航按钮试试效果吧