iPhone / iPad圆形强度计控制(包括图像)

时间:2012-03-08 16:27:56

标签: iphone objective-c ipad user-interface gauge

我找到了这个有趣的界面(从33秒http://vimeo.com/22946428开始),并且想为我自己的应用程序设计类似的东西。我对圆形强度计/旋钮控制特别感兴趣,如附图所示。 它具有非常具有未来感的感觉,使用touchesMoved:手势识别器回调实现起来应该相当简单。

但是为了不重新发明轮子,是否有任何开源库提供高级UI功能,如图片/视频中的那些?

更新:Hubert的回答演示了如何使用单指动作旋转表盘。这个难题的第二部分是:如何用颜色填充控件?

我正在考虑旋转背景颜色图像,但是其中的一部分必须被剪切或覆盖其他东西,从空背景变为完整。也许切出的元素(大约1弧度)可能会隐藏一组跟随手指的扇形段,并产生一种不断增加或减少量规填充的错觉。 6段x,y将连续动画,以这样的方式定位它们以便仅覆盖控制的所需部分。

Intensity gauge

3 个答案:

答案 0 :(得分:8)

答案 1 :(得分:1)

检查此仪表控件:GaugeKit

它是非常可定制的,所以你可以调整它,设置不是圆形的末端和所需的颜色 - 它看起来与图像上的仪表非常相似!

enter image description here

答案 2 :(得分:0)

以下是循环进度视图的示例。结合单指旋转控制,它可以创建一个与所要求的相似的尺寸(简单地将2个控件叠加在一起)

然后使用旋转回调链接两个控件:

  - (void) rotation: (CGFloat) angle
{
    // calculate rotation angle
    imageAngle += angle;
    if (imageAngle > 360)
        imageAngle -= 360;
    else if (imageAngle < -360)
        imageAngle += 360;

 progress = imageAngle/360.0;
}

DACircularProgress view + OneFingerRotationGestrureRecognizer