IOS scale demo

Effect:

IOS scale demo
1.png

.h file

/ / / / SXSRulerControl.h / / SXSInvestScaleSlider / / Created / / by Angela on 16/9/26. Copyright iaiai. All rights of 2016 / / reserved. / / #import / / IB_DESIGNABLE @interface SXSRulerControl UIControl lightweight scale control: @property (nonatomic, assign) IBInspectable CGFloat selectedValue; / / @property value selected (nonatomic, assign) IBInspectable NSInteger minValue; / / the minimum value @property (nonatomic, assign) IBInspectable NSInteger maxValue; / / the maximum value of @property (nonatomic, assign) IBInspectable NSInteger valueStep; / / step @property (nonatomic, assign) IBInspectable CGFloat minorScaleSpacing; / / small scale spacing, the default value of `8.0` @property (nonatomic, assign) IBInspectable CGFloat majorScaleLength; / / the main scale length, the default value `40.0` @property (nonatomic, assign) IBInspectable CGFloat middleScaleLength; / / middle scale length, the default value of `25.0` @property (nonatomic, assign) IBInspectable CGFloat minorScaleLength; / / small scale length, the default value of `10.0` @property (nonatomic, strong) IBInspectable UIColor *rulerBackgroundColor; / / the scale background color, the default is `clearColor` @property (nonatomic, strong) IBInspectable UIColor *scaleColor; / / scale color, the default is `lightGrayColor` @property (nonatomic, strong) IBInspectable UIColor *scaleFontColor; / / scale font color, the default is `darkGrayColor` @property (nonatomic, assign) IBInspectable CGFloat scaleFontSize; / / scale font sizes, the default is `10.0` @property (nonatomic, strong) IBInspectable UIColor *indicatorC Olor; / / indicator color, the default `redColor` @property (nonatomic, assign) IBInspectable CGFloat indicatorLength; / / pointer length, the default value is `40.0` @property (nonatomic, assign) IBInspectable NSInteger midCount; / / a few big marked with a scale of @property (nonatomic, assign) IBInspectable NSInteger smallCount; / / a large grid inside several small lattice @end

.m file

/ / / / SXSRulerControl.m / / SXSInvestScaleSlider / / Created / / by iaiai on 16/9/26. Copyright iaiai. All rights of 2016 / / reserved. / / #import "SXSRulerControl.h" #define kMinorScaleDefaultSpacing 20 #define kMajorScaleDefaultLength 25 / / small scale spacing / main scale height #define kMiddleScaleDefaultLength 17 / / #define / / kMinorScaleDefaultLength 10 middle height scale small scale height #define kRulerDefaultBackgroundColor ([UIColor clearColor]) / / scale background color #define kScaleDefaultColor ([UIColor lightGrayColor] #define (kScaleDefaultFontColor) / color scale [UIColor darkGrayColor] scale #define kScaleDefaultFontSize) / / 10 / / font color scale font #define kIndicatorDefaultC Olor ([UIColor redColor]) / / #define / / kIndicatorDefaultLength 80 default color indicator indicator (SXSRulerControl) @end @implementation height @interface SXSRulerControl{UIScrollView *_scrollView; UIImageView *_rulerImageView; UIView * _indicatorView;} #pragma mark - (instancetype) initWithFrame: constructor - (CGRect frame) {self = [super initWithFrame:frame]; if (self) {[self setupUI]}; return self;} - {[super (void) layoutSubviews layoutSubviews] (_rulerImageView.image; if = = Nil) {[self reloadRuler]}; CGSize size = self.bounds.size; _indicatorView.frame = CGRectMake (size.width * 0.5, size.height - 1, self.indicatorLength, self.indicatorLength); / / Set the scroll view content spacing CGSize textSize = [self maxValueTextSize]; CGFloat offset = size.width * 0.5 - textSize.width; _scrollView.contentInset = UIEdgeInsetsMake (0, offset, 0, offset);} #pragma mark - / - set attribute indicator color (void) setIndicatorColor: (UIColor * indicatorColor) {_indicatorView.backgroundColor = indicatorColor;} / selected - (numerical void setSelectedValue: (CGFloat) selectedValue if (selectedValue) {< < /span> _minValue selectedValue > _maxValue || ||; _valueStep < return = 0) {}; _selectedValue = selectedValue; [self = sendActionsForControlEvents:UIControlEventValueChanged]; CGFloat spacing self.minorScaleSpacing; CGSize size = self.bounds.size; CGSize textSize = [self maxValueTextSize]; CGFloat offset = 0; / / CGFloat steps offset = [self stepsWithValue:selectedValue]; offset = size.width * 0.5 - textSize.width - steps * spacing; _scrollView.contentOffset = CGPointMake (-offset, 0);} #pragma mark - UIScrollViewDelegate - (void) scrollViewWillEndDragging: (UIScrollView *) scrollView withVelocity: (CGPoint) velocity (targetContentOffset: inout CGPoint * targetContentOffset CGFloat) {spacing = self.minorScaleSpacing; CGSize = size self.bounds.size; CGSize textSize = [self maxValueTextSize]; CGFloat offset = targetContentOffset-> X + size.width * 0.5 - textSize.width; NSInteger = steps (NSInteger) (offset / spacing + 0.5); targetC OntentOffset-> X = (size.width * - 0.5 - textSize.width - steps - 0.5 * spacing);} - (void) scrollViewDidScroll: (UIScrollView * scrollView) {if (! (scrollView.isDragging scrollView.isTracking || || scrollView.isDecelerating)) {return}; CGFloat spacing = self.minorScaleSpacing; CGSize = size self.bounds.size; CGSize textSize = [self maxValueTextSize]; CGFloat offset = 0; offset = scrollView.contentOffset.x + size.width * 0.5 - textSize.width; NSInteger = steps (NSInteger) (offset / spacing + 0.5); CGFloat value = _minValue + steps * _valueStep/ (_midCount*_smallCount); if (value! = _selectedValue & & value (> & = _minValue; value = & < _maxValue {_selectedValue =)) Value; [self sendActionsForControlEvents:UIControlEventValueChanged];}} #pragma mark - drawing ruler method - (void) reloadRuler *image rulerImage] {UIImage = [self; if (image = = Nil) {return}; _rulerImageView.image = image; _rulerImageView.backgroundColor = self.rulerBackgroundColor; [_rulerImageView sizeToFit]; _scrollView.contentSize = _rulerImageView.image.size; / / hrule by alignment of CGRect rect = _rulerImageView.frame; rect.origin.y = _scrollView.bounds.size.height - _rulerImageView.image.size.height; _rulerImageView.frame = rect; / / update the initial value self.selectedValue = _selectedValue;} - (UIImage *) CGFl rulerImage {/ / the 1 constant calculation Oat steps = [self stepsWithValue:_maxValue]; if (steps = = 0) {return nil;} / / horizontal image size CGSize textSize = [self maxValueTextSize]; CGFloat height = _scrollView.frame.size.height-_rulerImageView.frame.size.height; CGFloat = startX textSize.width; CGRect rect = CGRectMake (0, 0, steps * self.minorScaleSpacing + 2 * startX, height); / / 2 image rendering UIGraphicsBeginImageContextWithOptions (rect.size, NO, 0); / / 1> draw the line UIBezierPath *path = [UIBezierPath bezierPath] for (NSInteger; I = _minValue; I = _maxValue; I = < _valueStep) {/ / CGFloat = x to draw the main scale (I - _minValue) / (_valueStep * self.minorScaleSpacing * _midCo Unt*_smallCount + startX); [path moveToPoint:CGPointMake (x, height); [path addLineToPoint:CGPointMake (x, height - self.majorScaleLength)]; / / [path moveToPoint:CGPointMake drawing the main scale (x, 0)]; [path addLineToPoint: CGPointMake (x, self.majorScaleLength)]; if (I = = _maxValue) {break}; / / small scale line drawing for (NSInteger J = 1; J < (_midCount*_smallCount); j++) {self.minorScaleSpacing CGFloat scaleX = x + J * [path; moveToPoint: CGPointMake (scaleX, height)]; CGFloat (scaleY = height (j%_smallCount = = 0)? Self.middleScaleLength: self.minorScaleLength; addLineToPoint:CGPointMake (scaleX) [path, s CaleY)];} / / draw small scale line for (NSInteger J = 1; J < (_midCount*_smallCount); j++) {self.minorScaleSpacing CGFloat scaleX = x + J * [path; / / moveToPoint:CGPointMake (scaleX, 0)]; CGFloat (scaleY = (j%_smallCount = = 0)? Self.middleScaleLength: self.minorScaleLength); / / on [path addLineToPoint:CGPointMake (scaleX, scaleY)]}}; [self.scaleColor set]; [path stroke]; / / 2> *strAttributes = [self NSDictionary drawing scale value for (NSInteger scaleTextAttributes]; I = _minValue; I = _maxValue; I = < _valueStep) {NSString *str = @ (I).Description; CGRect strRect = [str boundingRe CtWithSize:CGSizeMake (MAXFLOAT, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin attributes:strAttributes context:nil]; strRect.origin.x = (I - _minValue) / _valueStep * self.minorScaleSpacing * (_midCount*_smallCount) + startX - strRect.size.width * 0.5; strRect.origin.y =_scrollView.frame.size.height*0.5-textSize.height*0.5; [str drawInRect:strRect withAttributes:strAttributes];} UIImage *result = UIGraphicsGetImageFromCurrentImageContext (UIGraphicsEndImageContext); (return); result;} - (CGFloat) stepsWithValue: (CGFloat) value {if (_minValue = > value || _v AlueStep < = 0) {return 0;} return (value - _minValue) / _valueStep * (_midCount*_smallCount) - (CGSize);} maxValueTextSize {NSString = *scaleText @.Description (self.maxValue); CGSize size = [scaleText boundingRectWithSize: CGSizeMake (MAXFLOAT, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin attributes:[self scaleTextAttributes] context:nil].size; return CGSizeMake (floor (size.width). Floor (size.height));} - (NSDictionary * scaleTextAttributes) {CGFloat fontSize = self.scaleFontSize * [UIScreen * mainScreen].scale 0.6; return @{NSForegroundColorAttributeName: self.sca LeFontColor, NSFontAttributeName: [UIFont boldSystemFontOfSize:fontSize]} #pragma mark;} - setting interface - (void) setupUI _scrollView = [[UIScrollView {/ / scroll view alloc] initWithFrame:self.bounds]; _scrollView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; _scrollView.showsVerticalScrollIndicator = NO; _scrollView.showsHorizontalScrollIndicator = NO; _scrollView.delegate = self; _scrollView.layer.borderWidth=0.5; _scrollView.layer.borderColor=kScaleDefaultColor.CGColor; [self addSubview:_scrollView]; / / _rulerImageView = [[UIImageView alloc] init] image scale; [_scrollView addSubview:_rulerImageView]; / / view _ind indicator IcatorView [[UIView alloc] = init]; _indicatorView.backgroundColor = self.indicatorColor; [self addSubview:_indicatorView];} #pragma mark - the default values for the properties of small scale spacing / - (CGFloat) minorScaleSpacing {if (_minorScaleSpacing < = 0; _minorScaleSpacing = kMinorScaleDefaultSpacing) {}; return _minorScaleSpacing;} / / the main scale length - (CGFloat) majorScaleLength (_majorScaleLength = {if < 0) {_majorScaleLength} = kMajorScaleDefaultLength; return _majorScaleLength;} / / middle - scale length (CGFloat middleScaleLength) {if (_middleScaleLength = < _middleScaleLength = 0) {kMiddleScaleDefaultLength}; return _middleScaleLength;} / / small scale length - (CGFloat) minorSc AleLength {if (_minorScaleLength = < _minorScaleLength = 0) {kMinorScaleDefaultLength}; return _minorScaleLength;} / / scale background color (UIColor * rulerBackgroundColor) {if (_rulerBackgroundColor = = Nil) {_rulerBackgroundColor = kRulerDefaultBackgroundColor;} return _rulerBackgroundColor;} / / scale color (UIColor *) scaleColor {if (_scaleColor = Nil) {_scaleColor = kScaleDefaultColor;} return _scaleColor;} / / font color - scale (UIColor

Use in controller:

/ / / / SXSRulerControlVC.m / / SXSInvestScaleSlider / / Created / / by Angela on 16/9/26. iaiai. All rights / / Copyright 2016 reserved. //3.8M #import "SXSRulerControlVC.h" #import "SXSRulerControl.h" @interface (SXSRulerControlVC) < < /span> UITextFieldDelegate> @property (nonatomic, strong) UITextField *textfield; @property (nonatomic, strong) SXSRulerControl @end @implementation (SXSRulerControlVC - *ruler; void viewDidLoad) {[super viewDidLoad]; _textfield=[[UITextField alloc]initWithFrame:CGRectMake (80, 100, 100, 40)]; _textfield.backgroundColor=[UIColor lightGrayColor]; _textfield.textAlignment=NSTextAlignmentCenter; _textfield.delegate=self; [self.view = addSubview:_textfield]; _ruler [[SXSRulerControl alloc] initWithFrame:CGRectMake ([UIScreen mainScreen].bounds.size.width-40, 20, 0, 80)]; _ruler.center = self.view.center; [self.view = addSubview:_ruler]; _ruler.backgroundColor [UIColor _ruler.midCount=2; colorWithWhite:0.93 alpha:1]; / / a few big marked with a scale of _ruler.smallCount=5; / / a big several small lattice _ruler.minValue = 0; / / the minimum value _ruler.maxValue = 3000; / / the maximum value of _ruler.valueStep = 400; the scale difference between the two markers / / / / the size of each small princess large value was calculated as ruler.valueStep / (ruler.midCount*ruler.smallCount) _ruler.selectedValue = 1000; / / set the default value of [_ruler addTarget:self action:@selector (selectedValueChanged:) forControlEvents:UIControlEventValueChange D]; / / add} - monitoring method (void) selectedValueChanged: (SXSRulerControl * ruler) {_textfield.text = "%.f", [NSString stringWithFormat:@ ruler.selectedValue];} - (void) textFieldDidEndEditing: (UITextField *) textField{_ruler.selectedValue=textField.text.integerValue;} - (void) textFieldDidBeginEditing: (UITextField *) textField{_ruler.selectedValue=textField.text.integerValue @end;}