如何创建自定义分段控件-Swift

通常,我们的设计器会创建一些不是UIKit模式的组件。 大多数时候,我们可以做出一些改变,但有时却不能改变。 今天,我将教您如何创建自定义分段控件。

首先,让我们来一个UIKit分段控件。

在大多数情况下,我们都有边框,色调颜色和区域,我们可以自定义此分段控件。 假设您要创建此组件。

您在界面构建器中没有底视图来修改或删除所选节的背景。

让我们开始吧!

注意:我不会使用IBInspectable / IBDesignable,但是如果您知道如何使用它们,则可以。

我们的CustomSegmentedControl是UIView的子类,而不是UISegmentedControl

首先,我们需要创建变量:

我们有三个私有变量,为什么要私有? 因为我们不希望其他类可以在没有updateView的情况下更改此值。 使用默认值来自定义视图的三个变量。

现在我们需要显示按钮,但是我们有一个数组,这个数组可以是无限的。 最好的方法是创建一个水平堆栈视图 。 堆栈视图使子视图具有相等的间距,而不使用任何约束。

您如何意识到我们创建了四个约束来使我们的堆栈视图充满所有自定义视图。

现在,让我们创建选定的视图。 我们希望所选视图具有相同的按钮宽度。 我们需要用相等的部分数划分视图框架。

让我们在数组中添加一些按钮,我们该怎么做? 使用我们的buttonTitles数组。

首先,我们删除按钮中的任何元素,并删除视图中的所有子视图。 我们可以从按钮标题创建一个for,并从我们的标题创建一个单独的按钮,让我们设置标题,颜色和动作也添加到按钮数组中。

在本教程中,我考虑始终选择零部分。
让我们实现这种情况,将颜色设置为索引零的按钮。

在我们的动作函子中,我们必须创建一个用于从数组按钮中枚举的for,因为我们可以访问单个按钮和数组中的索引。 首先,我们需要将按钮设置标题颜色设置为默认颜色,之后我们需要进行比较以找到单击了哪个按钮。 我们需要找到X位置,并使用UIView.animated将我们的selectorView移到该位置,然后将按钮标题颜色设置为selectedColor

现在,我们创建一个名为updateView的功能,以调用其他三个配置功能。 很简单。

我们可以创建一个便利初始化或/和创建一个传递数组的函子。 我要创建这两个。 为什么? 因为与您一起使用的是“查看代码”,我们将使用我们的init,但是如果我们要创建IBOutlet,则需要调用函数。

如果您运行代码,它应该可以工作。 记住在viewDidLoad()中调用CustomSegmentedControl