如何自定义UISlider?

发布于 2024-08-04 23:26:16 字数 338 浏览 6 评论 0原文

我了解如何获得最小轨道和最大轨道图像,以及如何可拉伸它。然而,对于我的需求来说,这可能还不够控制。

我遇到的情况是,在左侧(最小轨道),我需要根据数据显示两种不同的颜色。左侧实际上代表两条数据,但在最小值和最大值之间仍然只存在一个拇指。

那我该怎么办呢???

有示例代码吗??

我实际上想要这样的

照片链接

在左侧,它是 grinish颜色,但当它超过拇指图像时,它会变成红色。

I understand how you can have a minimum track and maximum track image, and how it can be stretchable. However, for my needs, that might not be enough control.

I have a situation where on the left hand side (minimum track) I need to display two different colors, based on data. The left hand side actually represents two pieces of data, but yet there still exists only a single thumb between minimum and maximum.

so how can i do this???

Any sample code??

i actually want like this

photo link

On left hand side it is of grinish color but when it exceeds the thumb image it becomes red..

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

揪着可爱 2024-08-11 23:26:16

在 .h 文件

IBOutlet UISlider *slide;

中的 .m 文件

UIImage *minImage = [UIImage imageNamed:@"unselected.png"];
    UIImage *maxImage = [UIImage imageNamed:@"selected.png"];
    UIImage *tumbImage= [UIImage imageNamed:@"thumb.png"];
    minImage=[minImage stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0];
    maxImage=[maxImage stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0];
    [slide setMinimumTrackImage:minImage forState:UIControlStateNormal];

中,unselected.png 和 selected.png 是充当 bar 和在栏上滑动的thumb.png 的图像。

In your .h file

IBOutlet UISlider *slide;

in your .m file

UIImage *minImage = [UIImage imageNamed:@"unselected.png"];
    UIImage *maxImage = [UIImage imageNamed:@"selected.png"];
    UIImage *tumbImage= [UIImage imageNamed:@"thumb.png"];
    minImage=[minImage stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0];
    maxImage=[maxImage stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0];
    [slide setMinimumTrackImage:minImage forState:UIControlStateNormal];

unselected.png and selected.png are the images that act as bar and thumb.png which slide over the bar.

醉态萌生 2024-08-11 23:26:16

将图像交换代码放入滑块值读取方法中,通常是:

-(IBAction)sliderChanged:(id)sender; {}

每当滑块值达到某个预定义值时,将自定义绿色图像与自定义红色图像交换。请参阅下面的示例。

// Switches the -thumbImage between an ivar named highImage and lowImage 
// when the slider passes the halfway point  

if (sliderValue > 0.5) {
    [self updateSliderThumbWithImage:self.highImage];
} else {
    [self updateSliderThumbWithImage:self.lowImage];
}

像这样定义滑块图像更新方法:

-(void)updateSliderThumbWithImage:(UIImage *)image;
{
    [self.slider setThumbImage:image forState:UIControlStateNormal];
    [self.slider setThumbImage:image forState:UIControlStateHighlighted];
}

// You have to set thumb images for both states  
// or your image will vanish when user slides it. 
// Not sure if you have to do the same with the track image, though.  

希望这对某人有帮助。

Put your image swapping code in your slider value-reading method, which is usually:

-(IBAction)sliderChanged:(id)sender; {}

Swap your custom green image with a custom red image whenever your slider value reaches some predefined value. See example below.

// Switches the -thumbImage between an ivar named highImage and lowImage 
// when the slider passes the halfway point  

if (sliderValue > 0.5) {
    [self updateSliderThumbWithImage:self.highImage];
} else {
    [self updateSliderThumbWithImage:self.lowImage];
}

define the slider image update method like this:

-(void)updateSliderThumbWithImage:(UIImage *)image;
{
    [self.slider setThumbImage:image forState:UIControlStateNormal];
    [self.slider setThumbImage:image forState:UIControlStateHighlighted];
}

// You have to set thumb images for both states  
// or your image will vanish when user slides it. 
// Not sure if you have to do the same with the track image, though.  

Hope this helps somebody.

淡墨 2024-08-11 23:26:16

我不确定我是否可以想象您需要什么(您有机会发布草图吗?),但是搜索 UISlider,您可以找到一些非常有创意的用途。否则,您可以创建自己的自定义 UIControl。


(来源:texlege.com)

I'm not sure if I can visualize what you need (any chance you can post a sketch?), but do a search for UISlider and you can find some pretty creative uses. Otherwise you can create your own custom UIControl.


(source: texlege.com)

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文