美文网首页
iOS 借助stretchableImageWithLeftCa

iOS 借助stretchableImageWithLeftCa

作者: 马威明 | 来源:发表于2018-11-15 15:58 被阅读0次

    公司有一个需求 通过滑动条控制设备 滑动条要求带圆角具体需求如下:

    带圆角滑动条

    右侧的圆角比较简单 可通过一张带圆角的背景图模拟滑动条的圆角 然后滑动条右边设置为透明即可,左边部分 由于滑条长度不确定 没法直接切对应的图片只能自己想办法处理。


    滑动条背景图

    后来发现滑动条设置完左右的图片后,在滑动过程中是对图片进行自动拉伸的,没有圆角且为纯色的情况下直接设置图片是没有任何问题的。

    但是遇到圆角的需求以后 圆角会随着图片被拉伸,达不到理想效果: 被拉伸后的圆角效果
    后来找到这个方法:
    - (UIImage *)stretchableImageWithLeftCapWidth:(NSInteger)leftCapWidth topCapHeight:(NSInteger)topCapHeight 
    

    这是UIImage的一个实例函数,用image的实例调用,并返回处理后的新image实例。它的功能是创建一个内容可拉伸,而边角不拉伸的图片,需要两个参数,第一个参数是左边不拉伸区域的宽度,第二个参数是上面不拉伸的高度。
    根据设置的宽度和高度,将接下来的一个像素进行左右扩展和上下拉伸。

    可拉伸的范围都是距离leftCapWidth后的1竖排像素,和距离topCapHeight后的1横排像素。

    参数的意义是,如果参数指定8,0。那么,图片左边8个像素,上边0个像素。不会被拉伸,x坐标为9和一个像素会被横向复制,y坐标为1的一个像素会被纵向复制。

    只是对一个像素进行复制到一定宽度。而图像后面的剩余像素也不会被拉伸。

    使用此方法完美解决问题。
    全部的代码实现如下:

    UISlider *slider = [[UISlider alloc] initWithFrame:CGRectMake(90, 12 + 60 * i, iPhoneWidth - 200, 15)];
            UIView *sliderBgV = [[UIImageView alloc] initWithFrame:CGRectMake(92, 12 + 60 * i, iPhoneWidth - 202, 15)];
            sliderBgV.backgroundColor = kColor_themeWithAlpha;
            sliderBgV.layer.cornerRadius = 7.5;
            sliderBgV.layer.masksToBounds = YES;
            sliderBgV.layer.borderColor = WhiteColor.CGColor;
            sliderBgV.layer.borderWidth = 0.5;
            sliderBgV.userInteractionEnabled = YES;
            [self.view addSubview:sliderBgV];
            //设置已滑动位置背景图片
            UIImage *image = [UIImage imageNamed:@"7-5"];
            //设置左边的圆角不被拉伸
            UIImage *image1 = [image stretchableImageWithLeftCapWidth:7.5 topCapHeight:0];
            [slider setMinimumTrackImage:image1 forState:UIControlStateNormal];
            //设置未滑动位置背景图
            [slider setMaximumTrackImage:[UIImage imageWithColor:ClearColor size:slider.size] forState:UIControlStateNormal];
            //设置滑块图标图片
            [slider setThumbImage:[UIImage imageNamed:@"滑动条白色小圆点"] forState:UIControlStateNormal];
            //设置点击滑块状态图标
            [slider setThumbImage:[UIImage imageNamed:@"滑动条白色小圆点"] forState:UIControlStateHighlighted];
            //设置起始位置
            slider.value=0.00;
            //设置最小数
            slider.minimumValue=0;
            //设置最大数
            slider.maximumValue=100;
    //        slider.minimumTrackTintColor = WhiteColor;
    //        slider.maximumTrackTintColor = kColor_themeWithAlpha;
            slider.tag = 100 + i;
            //设置委托事件
            [slider addTarget:self action:@selector(alphaSliderMoved:) forControlEvents:UIControlEventValueChanged];
            [self.view addSubview:slider];
    

    附上参考链接

    相关文章

      网友评论

          本文标题:iOS 借助stretchableImageWithLeftCa

          本文链接:https://www.haomeiwen.com/subject/tcpyfqtx.html