设计UISegmentControl

Question

我正在使用这样的分段控制设计

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

Answer 1

我有两点建议：

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

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

这将是相当多的工作，但是会是这样的：

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

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