SwiftUI如何写一个单独项禁用功能的SegmentPicker高仿控件

最新推荐文章于 2024-05-22 08:25:28 发布
最新推荐文章于 2024-05-22 08:25:28 发布
阅读量491 收藏
点赞数
分类专栏： iOS开发之旅 文章标签： SwiftUI Picker Segment GeometryReader alignmentGuide
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mydo/article/details/109488235
版权
本文介绍如何在SwiftUI中扩展Picker，创建一个名为StateSegmentView的控件，模仿原生SegmentPicker风格，并实现子项禁用和切换动画。通过GeometryReader和AlignmentGuide实现子项的禁用功能和流畅动画。
摘要由CSDN通过智能技术生成

在这里插入图片描述

加强SwiftUI原生Picker控件功能

先上效果图:

在这里插入图片描述

在这里插入图片描述

我们知道SwiftUI中自带有标准的Picker控件，如果对它应用SegmentedPickerStyle样式，那么我们就得到了UIKit中对应的UISegmentControl控件。

但某些情况下，Picker控件达不到我们的要求，比如我们希望Picker中的某些项可以被禁用，这是默认控件目前无法实现的。

这里就让本猫演示一下如何写一个实现子项禁用功能的Picker控件加强版。

但请不要误会，这里不会直接用到UIKit，我们只是在SwiftUI中对其扩展。

了解本专栏 订阅专栏 解锁全文 超级会员免费看
大熊猫侯佩
关注
专栏目录
订阅专栏
SwiftUI 使用 Picker 实现 UISegmentedControl 的效果
github_29300109的博客
04-09 311
一个简单的代码和效果图 简单代码 import SwiftUI enum CYCoverLocationType: String, CaseIterable, Identifiable{ case eye case face var id: String { self.rawValue } } struct SwiftUIView: View { var coverLocationTypes = ["Eye","Face"] @State priva
SwiftUI Picker分段选择组件（教程含源码）
iCloudEnd的博客
01-31 676
实战需求 SwiftUI Picker分段选择组件 本文价值与收获 看完本文后，您将能够作出下面的界面 看完本文您将掌握的技能 Picker 组件选择器 标注选择内容Text(“Red”).tag(0) 分段选择器 .pickerStyle(SegmentedPickerStyle()) 基础知识 Picker 选择器 用于从一组互斥值中进行选择的控件。 struct Picker<Label, SelectionValue, Content> where Label : View,
SwiftUI从入门到实战第2章第5节：Segment
互动教程网[www.hdjc8.com]
05-13 785
相关课程：http://hdjc8.com/hdjc/swiftUI/ Segment分段控件，类似于UIKit中的UISegmentedControl。分段控件提供一栏选项按钮，一次只能激活其中一个选项按钮。用于实现若干选项的单选。使用分段拾取器，可以在多个视图区域进行快速的跳转。 示例代码： struct ContentView : View { //给当前的结构体添加一个数组属性，作为Picker列表的数据源。 private var animals = ["???
SwiftUI中普通Picker的用法（WheelPickerStyle，SegmentedPickerStyle，InlinePickerStyle，MenuPickerStyle）
郭永明的技术专栏
05-22 1420
Picker使用户能够在使用iOS应用程序时在多个选项之间进行选择。在本文中，我们将了解它们的各种类型，并探索它们是如何声明、配置和样式的。和Button差不多，Picker是iOS应用中最常用的UI元素之一。
ios自定义分段控件_使用swiftui自定义ios分段控件
weixin_26735419的博客
09-28 754
ios自定义分段控件In this article, I’ll be sharing my implementation of a custom SegmentedPicker in SwiftUI. You may ask, “Why go through the pain of implementing this yourself?” 在本文中，我将分享我在SwiftUI中自定义Segment...
SwiftUI如何自定义Button效果设置字体颜色和控制变色效果 中禁用按钮时防止按钮褪色
iCloudEnd的博客
05-25 1358
本文价值与收获 看完本文后，您将能够作出下面的界面 一、Button基础知识 （一）什么是Button Button是触发时执行操作的控件。他的定义如下 struct Button<Label> where Label : View “触发”按钮的方法可能会有所不同。例如，在iOS上，通过点击屏幕上的按钮可以触发按钮，而在tvOS上，可以通过在按钮处于焦点状态时按下外部遥控器上的“选择”来触发按钮。 （二）Button如何使用 Button是SwiftUI最常用的交互控件，下面就是Butt
关于单独禁用element-ui table全选按钮的实现方案（奇奇怪怪的需求...）
csdn6107的博客
10-13 2162
关于单独禁用element-ui table全选按钮的实现方案
Unity GUI 通过某个GUI控件禁用另一个GUI控件
tangdaxue43的博客
01-06 2680
前言: Unity的GUI系统相对UGUI系统而言,实在是不方便. 就如GUI控件的启用和禁用,也没有UGUI中的SetActive方法来得方便. GUI中有个变量为enabled,可以控制"图形用户界面组件是否被启用",有2个布尔值true和false供选用.但是其针对所有的GUI控件同时生效. 问题来了: 如果想用gui控件A自由地"禁用"和"启用"gui控件B,使用了GUI.enab
C#自定义控件库
01-22
自定义控件是软件开发中的一个重要环节，特别是在UI设计和用户体验优化上。 自定义控件的创建通常涉及以下几个关键知识点： 1. **继承与派生**：在C#中，自定义控件通常是通过继承已有的系统控件（如Button、Label...
android 9.0 屏蔽系统所有通知功能实现
热门推荐
安卓兼职framework和app工程师的博客
12-18 1万+
在9.0的系统产品开发中，对原生系统中的通知功能，也是必须的非常重要的部分，而在产品开发的定制需要各式各样的，所以在开发一款 产品的时候，由于禁用了下拉状态栏，所以需求要求禁用掉系统的通知功能，不接收所有的通知，接下来看下系统的通知服务相关功能 然后实现功能需求
学习使用SwiftUI开发MacOS应用 - 第4节 单选框与单选组的实现美化及流式布局
wj008的专栏
04-02 1042
在SwiftUI 中 是没有单选框的这个视图控件的，要实现单选框 单选组需要借助Picker 视图来实现，它会使用系统默认的风格，这可能不是我们想要的效果，为了制作漂亮的单选框我们需要自己动手来实现相应的功能。 首先 我们先看看系统自带的效果： 代码如下： struct ContentView: View { @State var selection = 0 var body: some View { VStack{ Text("Hello, W.
ios swift JXSegmentedView的使用
baidu_40537062的博客
01-07 3705
文章目录1.JXSegmentedView的使用演示，下面的博客GIF非常的全面2. 1.JXSegmentedView的使用演示，下面的博客GIF非常的全面 【干货】每个APP都用得上的SegmentedView(Swift版本) 2.
SwiftUI - 常用控件：Slider、Stepper、Picker、Toggle、Form、LoadingView、Gradient、AnyView
AI + 工程
11-19 2752
Slider 其他 Stepper 官网示例1 官网示例2 Picker 选择文字内容 选择时间 Segment Toggle Form Section EnableDisable ShowHide LoadingView 一 二 AnyView
SwiftUI 自定义 segmented control
巍的博
08-13 1169
无聊的开始： 需要创建一个segmented control，效果如下： 是不是看着很眼熟，没错，很像Android上的对不对？！黑色下划线会移动到所选择的title下面，而且能根据文字的长度自动伸缩。 为啥这么像android的？因为耗了一个下午弄出来后发现，我打开的Figma设计页面是Android的。。。 所以好吧，如果你也尿手上了， 不是， 如果你也需要类似的设计，希望这篇文章能帮到你。 蕾丝正文： 不要问我正文为啥是蕾丝的，难道你不喜欢？！ 首先，SwiftUI 自带的
swift中UISegmentController的使用
番薯大佬的专栏
09-30 3980
let segment = UISegmentedControl(frame: CGRectMake(10.0, 10.0, (CGRectGetWidth(self.view.bounds) - 10.0 * 2), 40.0)) self.view.addSubview(segment) segment.backgroundColor = UIColor.lightGrayC
Swift - 分段选择控件（UISegmentedControl）的用法
weixin_33807284的博客
09-25 194
1，选择控件的创建，并监听控件选择值 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 class ViewController: UIViewController {     override func viewDidLoad() {         su...
mui picker禁用选项
qq_37338658的博客
03-17 820
mui级联选择器禁用某一项 修改 1.mui.picker.js 307行 修改前 buffer.push('<li>' + (item.text || item) + '</li>'); 修改后 buffer.push('<li '+ (item.disabled ? 'style="color: #ccc"' : '') + '>' + (item.text || item) + '</li>'); 2.mui.poppicker.js 65-70行
分段选择器（好用的第三方）---滑动选择对应不同的控制器页面--点击选择不同的控制器页面
春风得意，马蹄仍急；少年豪情，一笑难回。
03-02 2479
http://code.cocoachina.com/list/14/2 http://code.cocoachina.com/view/129164 用名字搜索比如说：LGSegments等~~~
基于java的共享汽车管理系统的开题报告2.docx
最新发布
09-25
基于java的共享汽车管理系统的开题报告2.docx
swiftui 变量page 小于等于1 禁用
05-25
你可以在SwiftUI中使用`@State`属性包装器来管理视图的状态。假设你有一个名为`page`的变量，你可以在你的视图中这样使用它： ```swift struct ContentView: View { @State private var page = 1 var body: some View { VStack { Text("Current page: \(page)") Button(action: { if (page > 1) { page -= 1 } }) { Text("Previous page") }.disabled(page <= 1) } } } ``` 这里，我们使用了`@State`属性包装器来声明一个名为`page`的变量，并在视图中使用它。当用户点击“Previous page”按钮时，我们检查`page`是否大于1，如果是，我们将其减1。我们还通过将`disabled`修饰符应用于按钮来禁用它，如果`page`小于或等于1。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

大熊猫侯佩

赏点钱让我买杯可乐好吗 ;)

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值