设计UISegmentControl

时间:2017-01-07 04:34:01

标签: ios swift uisegmentedcontrol

我正在使用这样的分段控制设计 enter image description here

如何设计我的片段,使所选片段看起来像“ALL”,如上图所示。我可以想到在选择时使用不同的图像,但如果我这样做,那么“其他”中的曲线的某些部分将不可见。有关设计UISegmentControl的任何建议吗?

1 个答案:

答案 0 :(得分:3)

我有两点建议:

  1. 找到一种可以避免这种情况的替代方法。 许多应用程序试图通过设计自定义组件和UI来增加喜悦,而实际上它并没有真正为应用程序添加太多。在最坏的情况下,你可能会因为使用非标准组件而无法按预期方式工作,或者在他们尝试使用你的应用程序时增加认知负担,从而使人们感到沮丧。

  2. 使用自定义子类转到100%。 不仅仅是满足于设置静态背景图像,而是投资创建一个不仅在选定状态下看起来像这样的组件,还可以在人们更改所选项目时提供动画。

  3. 这将是相当多的工作,但是会是这样的:

    • 继承UISegmentedController - 它提供了您正在寻找的功能的基础,这是好的;
    • 为控件背景图层添加新的CAShapeLayer
    • 找出一个动态贝塞尔曲线可以更新所有状态(可能最终会有每个段的控制点)你可以手动完成这个,但是我必须使用像PaintCode这样的工具来生成贝塞尔曲线代码,并使用Illustrator制作初始曲线
    • 为段更改的事件更改添加侦听器,并根据需要重新计算曲线控制点

    这方面的正面注意事项是CAShapeLayer上的路径属性是可动画的,因此当段更改并且曲线更新时,动画可能是最简单的部分!