工具栏如何用画出来

　　工具栏用来展示和方便用户完成当前页面的主要操作，俗称操作栏。
　　典型应用场景
　　原型画法（无交互）
　　工具栏通常包含多个操作按钮。位于屏幕底部。
　　先画工具栏背景，从默认元件库拖动矩形2到工作区位置（0，617），修改尺寸为（375，50）。
　　再画操作，从默认元件库拖动链接按钮到工具栏，双击输入文字操作，移动到合适位置。
　　再画2个操作按钮。
　　生成原型HTML并在浏览器中查看效果。
　　原型画法（有交互）
　　工具栏的常见交互效果：
　　固定位置不随着页面内容而移动。方法同状态栏。
　　每个操作按钮有不同的交互，需要单独设置。
　　高保真原型画法
　　接下来以淘宝APP商品详情工具栏为案例，讲解高保真原型的详细画法。
　　先画工具栏背景。从默认元件库拖动矩形2到工作区位置（0，617），修改尺寸为（375，50）。
　　再画店铺文字。从默认元件库拖动文本标签到工具栏，双击输入文字店铺，修改字体尺寸为12。然后从默认元件库拖动图片到工具栏，缩放到2020，移动它们到合适位置。
　　然后从阿里巴巴矢量图标库网站http：www。iconfont。cncollectionsindex搜索店铺，找到合适的图标，下载svg格式。再双击店铺图片，导入该svg图标。并尽量缩放到当时设置的尺寸2020。
　　如：需修改图标的颜色，请选中并右键转换SVG图片为形状，然后设置它的填充色为红色ff0000。
　　再画客服和收藏。方法同上。
　　再画加入购物车。从默认元件库拖动矩形3到工具栏的合适位置，修改尺寸到合适大小，双击输入文字加入购物车。修改文字颜色为ffffff，修改填充色为橙色ffa501，设置圆角半径100并取消选中应用到右边两个边框。
　　再画立即购买。修改文字颜色为ffffff，修改填充色为红色fc4537。设置圆角半径100并取消选中应用到左边两个边框。
　　生成原型HTML并在浏览器中查看效果。
　　添加到APP元件库
　　不同场景下的工具栏功能，操作不一样，位置是一样，样式相对固定。
　　作者根据多年PM经验，总结出2种常用的工具栏，添加到APP元件库。
　　工具栏（文字）
　　工具栏（图标）
　　注意事项
　　工具栏很少和标签栏共存于一个页面中。
　　工具栏最好有单独的填充色，方便和页面其他内容区分。
　　有时候很容易把工具栏误认为标签栏，两者的区别是标签栏是承载APP整体的功能模块，而工具栏只是用来承载某一页面的常见操作。
　　提供源文件下载学习https：pan。baidu。coms1lOysRY59IOQN7Hhl7jrI3g
　　相关阅读
　　APP单选功能如何用Axure画出来
　　APP开关功能怎么用Axure画出来
　　APP九宫格如何用Axure画出来
　　APP上导航如何用Axure画出来
　　APP下导航如何通过Axure画出来
　　常见的列表页如何用Axure画出来