零基础美化篇之QQ系列-005-导航按钮

易团雪

观察QQ导航按钮的朋友会发现只有文字不同，其他状态效果一样
有朋友肯定想到该怎么设计了吧！找到了共同特性就可以针对的设计，避免做重复工作
所以这里同样用资源文件resource.res
1.添加布局元素
布局-项：布局宽度=填充父，布局高度=40，内填充：0,2,0,0
2.添加按钮
添加三个按钮元素并进行如下设置
常规：组ID=10001，按钮类型=单选，文本分别设置：联系人/消息/空间
字体：点击后面的设置按钮弹出以下对话框，添加-设置好字体相关信息并确认。这里我只设置了大小为12
也可以在资源文件resource.res中-字体栏进行设置

开关：背景透明=真，第一个按钮设置是否选中=真
布局-项：布局宽度=占用剩于空间，布局高度=填充父
3.背景资源

先设置好背景资源的名称相关信息，便于后面查找调用
双击打开背景编辑器这里我们添加四个状态的效果，如图：

这里分别设置离开/停留/按下/选中的文本颜色
离开:#FF868686，停留：#FF000000，按下/选中：#FF12B7F5
如图：

状态对像列表选择选中状态，添加矩形对象
工具栏：模拟高度设置为40，这里的40是按照上面的布局元素的高度
其他属性设置如下如：

到此就完成导航按钮的背景设计
切换到窗口设计界面，外观-背景信息进行设置一下即可