UISlider与ProgressView结合使用

问题描述：

是否有苹果屋制造的方式来获得带有ProgressView的UISlider。这由许多流应用程序使用，例如本机quicktimeplayer或youtube。
（只是为了确定：我只对可视化感兴趣）

Is there an apple-house-made way to get a UISlider with a ProgressView. This is used by many streaming applications e.g. native quicktimeplayer or youtube. (Just to be sure: i'm only in the visualization interested)

欢呼西蒙

答

这是你所描述的简单版本。

Here's a simple version of what you're describing.

从某种意义上来说，它是简单的我没有尝试添加阴影和其他细微之处。但它很容易构建，如果你愿意，你可以调整它以更微妙的方式绘制。例如，您可以创建自己的图像并将其用作滑块的拇指。

It is "simple" in the sense that I didn't bother trying to add the shading and other subtleties. But it's easy to construct and you can tweak it to draw in a more subtle way if you like. For example, you could make your own image and use it as the slider's thumb.

这实际上是一个位于UIView子类（MyTherm）顶部的UISlider子类温度计，以及两个绘制数字的UILabel。

This is actually a UISlider subclass lying on top of a UIView subclass (MyTherm) that draws the thermometer, plus two UILabels that draw the numbers.

UISlider子类消除了内置轨道，因此它后面的温度计显示出来。但UISlider的拇指（旋钮）仍然可以按正常方式拖动，您可以将其设置为自定义图像，当用户拖动时获取Value Changed事件，依此类推。以下是UISlider子类的代码，它消除了自己的轨道：

The UISlider subclass eliminates the built-in track, so that the thermometer behind it shows through. But the UISlider's thumb (knob) is still draggable in the normal way, and you can set it to a custom image, get the Value Changed event when the user drags it, and so on. Here is the code for the UISlider subclass that eliminates its own track:

- (CGRect)trackRectForBounds:(CGRect)bounds {
    CGRect result = [super trackRectForBounds:bounds];
    result.size.height = 0;
    return result;
}

温度计是自定义UIView子类MyTherm的一个实例。我在笔尖中实例化它并取消选中它的Opaque并给它一个Clear Color的背景颜色。它有值属性，因此它知道填充温度计的数量。这是 drawRect：代码：

The thermometer is an instance of a custom UIView subclass, MyTherm. I instantiated it in the nib and unchecked its Opaque and gave it a background color of Clear Color. It has a value property so it knows how much to fill the thermometer. Here's its drawRect: code:

- (void)drawRect:(CGRect)rect {
    CGContextRef c = UIGraphicsGetCurrentContext();
    [[UIColor whiteColor] set];
    CGFloat ins = 2.0;
    CGRect r = CGRectInset(self.bounds, ins, ins);
    CGFloat radius = r.size.height / 2.0;
    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path, NULL, CGRectGetMaxX(r) - radius, ins);
    CGPathAddArc(path, NULL, radius+ins, radius+ins, radius, -M_PI/2.0, M_PI/2.0, true);
    CGPathAddArc(path, NULL, CGRectGetMaxX(r) - radius, radius+ins, radius, M_PI/2.0, -M_PI/2.0, true);
    CGPathCloseSubpath(path);
    CGContextAddPath(c, path);
    CGContextSetLineWidth(c, 2);
    CGContextStrokePath(c);
    CGContextAddPath(c, path);
    CGContextClip(c);
    CGContextFillRect(c, CGRectMake(r.origin.x, r.origin.y, r.size.width * self.value, r.size.height));
}

要更改温度计值，请更改MyTherm实例的值到0到1之间的数字，并告诉它用 setNeedsDisplay 重绘自己。

To change the thermometer value, change the MyTherm instance's value to a number between 0 and 1, and tell it to redraw itself with setNeedsDisplay.

UISlider与ProgressView结合使用

相关推荐