无限互联iOS开发实战项目一之--评分视图（星星封装）详解..doc

无限互联iOS开发实战项目一之-- 评分视图（星星封装）详解 学习要点： 1、面向对象思想 2、对于背景图片平铺的理解 3、自定义视图的可扩展性 内容部分： 一．需求分析： 如上图所示： 1、星星视图包括：星星视图、评分视图（其中星星视图包括评分星星的为黄色，为达到评分的星星视图为灰色）。 2、我们在项目中会多次用到评分的星星视图，所以我们用面向对象的思想，把星星的整体视图封装成一个自定义视图。 3、既然要封装成独立的视图，我们就要考虑我们这个视图的灵活性： (1)在每一个页面的视图的星星大小可能不一样 (2)评分文字视图的样式、评分视图的字体颜色大小等 (3)我们视图的大小要根据什么设置 (4)我们整个视图是可以动态设置大小的，评分的文字是否也得需要自动的调节大小那 (5)功能分析，我们是根据分数去展示星星视图的平铺效果 二．技术实现： 1、实现思路： (1)为了优化APP的性能，我们采取背景平铺图片去设置图片 (2)怎么实现背景平铺：uiview通过colorWithPatternImage：去设置背景颜色，关键是UIView的大小设置怎么能达到我们预想的效果那，首先uiview的高度为（星星图片的高度），宽度为（星星图片的宽度*5）这样我们就显示了5个星星。如何设置视图的大小，通过transform设置UIView的缩放比例，设置到我们想要的大小； (3)黄色星星显示：我们通过覆盖效果去实现，灰色的星星我们设置5个放在底部，在创建一个黄色星星的视图放在灰色星星的上部分，只需要设置视图的宽度，黄色星星会自动被截取 (4)评分文本：要实现我们页面显示的效果，通过系统内置的字体无法达到我们想要的效果，我们怎么做？（用3个UILabel去实现，只需调整位置我们就可以实现我们想要的效果）； 2、实现代码 (1)WXRatingView.h (2) WXRatingView.m 总结：本文通过实现一个自定义的星星视图，让我们学会如何封装一个自定义的控件，封装一个自定义的控件要注意哪些，重要是考虑自定义控件的灵活和可扩展性； 代码： WXRatingView.zip 作者：朱思明? 出处：无限互联3G学院http://www.iphonetrain?.com 本文版权归作者和无限互联3G学院共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。 ?  // // WXRatingView.h // WXMovie // // Created by 朱思明 on 13-8-30. // Copyright (c) 2013年 朱思明. All rights reserved. // #import UIKit/UIKit.h @interface WXRatingView : UIControl { float _scale;//缩放比例 NSMutableArray *_subViewArray;//存放子视图的数组 } @property(nonatomic,assign)float scoreNum;//分数属性 //自定义初始化方法参数说明（frame：坐标正常布局，大小只需要给视图的高度就可以，宽度是自动调节的） (id)initWithFrame:(CGRect)frame labelTextColor:(UIColor *)labelTextColor; @end // // WXRatingView.m // // Created by 朱思明 on 13-8-30. // Copyright (c) 2013年 朱思明. All rights reserved. // #import WXRatingView.h #define starWidth 35 //图片的宽度 #define starHeight 33 //图片的高度 /* *正常星星大小（星星的大小根据我们视图的高度动态去设定） *星星的大小我们设置为视图高度的60%，上下空闲位置均为20% *缩放比例 *星星的高度 / 图片的高度 = 我们想要的比例 */ #define scale(height) height * .6 /starHeight @implementation WXRatingView - (id)initWithFrame:(CGRect)frame labelTextColor:(UIColor *)labelTextColor { self = [super initWithFrame:frame]; if (self) {