零基础美化篇之QQ系列-002-控制栏按钮

admin

上一节我们设置好了窗口的背景，接着来设计一下标题栏的控制按钮
1.窗口的开关分组
启用-布局=真，覆盖窗口边框=真。字面意思应该都能明白
2.添加布局元素
布局-项：布局宽度=填充父，布局高度=30
布局盒子：水平对齐=右，设置靠右对齐
3.添加按钮元素
在布局元素里添加7个按钮元素(按Ctrl+A键可以陆续添加，记得是上面的布局元素)
删除按钮文本并设置按钮的背景透明=真，菜单按钮设置布局宽度=20，其他的宽度设置=30
没有VIP的就只能一个一个的去删除
这里有VIP的朋友就很方便了，可以选择全部按钮，然后在文本属性删除文本就可以了
设置右边的第一个和第二个的按钮类型为：关闭和最小化
如图：


4.设计按钮背景状态
一.关闭按钮


这里选择三个状态效果就可以了。其他的目前还用不到
状态分组列表区：选择离开状态-工具栏-矩形-编辑区点击
属性区矩形如下设置:


重新在添加一个矩形，宽度：18，高度：1其他设置不变
这样我们就达到了关闭图标的效果



形状对象列表区选择-矩形-状态分组区-点击一下链接图标的按钮(把停留/按下都选择上)
上图可以看到下面那个矩形的链接后面显示一个3，在表示离开/停留/按下三个状态都用了这个形状
为了更好的区分可以对形状对象列表的每个对象进行重命名操作，上图中有一支笔的图标就是重命名的


选择停留状态，添加矩形。铺满和颜色进行如上图设置。
上图中的红色框的上下箭头按钮，可以对某个对象进行上下移动。这里我们把红色背景移到底层
按下状态也这样操作。颜色设置不同的就好了
到此，关闭按钮的背景就设置完成了。
最小化按钮可以参照以上操作进行设计（大家可以练习一下）
二.菜单按钮
观察QQ的朋友可能发现，菜单在一排按钮只是图标不一样。三个状态效果是一样的
其实关闭按钮和最小化按钮也可以这样设置，只是这里我们是直接画了图标效果
为了不重复工作都是做一样的东西。这里我们使用资源文件res，这样只要设计一个其他元素就都可以调用

打开resource.res资源文件-背景资源-添加
在弹出的窗口里面对象类型我们选择按钮，因为现在我们设计的是菜单相关按钮的状态效果
名称：我们可以修改为便于理解和记忆的，如：QQ菜单按钮状态效果
描述：如果名称起的不好这里可以填写详细的描述信息

双击进入背景管理器窗口界面，到此我们就按关闭按钮的操作来设计了。


这里区别就是只设计了停留和按下效果，离开没有设置。因为前面设置了背景透明为真
所以这里默认就是透明在加上等下设置的图标组合成的离开效果，其他两个效果也是如此
注意：设计哪个状态效果，就要选择哪个效果进行设计



现在添加一下需要的图片资源进来，res资源文件-图片
操作方式：
1.可以添加按钮一个一个往里面添加
2.可以直接拖放要添加的资源(此功能为VIP收费功能)
3.同步按钮可以一次性就添加进来，前提是要准备好相关资源
新建按钮：可以设置目录，在资源比较多的时候不会很乱(此功能为VIP收费功能)
完成以上设计后我们切换回xml窗口设计界面


设计窗口选择按钮-外观-背景信息-在弹出窗口选择我们刚才设计的按钮状态效果
外观-图标-弹出的窗口选择图片文件


其他的按钮按照以上两步操作即可，最终完成效果如图：