swiftui中常用组件picker的使用,以及它的可选样式

一个可选项列表就是一个picker组件搞出来的,它有多个样式可以选择,并且可以传递进去一些可选数据,有点像前端页面里面的seleted组件,但是picker组件的样式可以更多。可以看官方英文文档:PickerStyle | Apple Developer Documentation

简单使用

使用的时候,需要绑定一个状态值:

//
//  ContentView.swift
//  SwiftBook
//
//  Created by song on 2024/7/2.
//

import SwiftUI

struct ContentView: View {
    @State var name = ""
    @State var password = ""
    @State var gender = ""
    @State var dataList = ["男", "女", "其他"]
    @State var info = "简介"

    var body: some View {
        VStack(alignment: .leading) {
            Image("desktop")
                .resizable()
                .frame(width: .infinity, height: 260)
                .mask(RoundedRectangle(cornerRadius: 30))

            TextField(text: $name, label: {
                Text("用户名")
            }).padding()
            SecureField(text: $password, label: {
                Text("密码")
            }).padding()
            // 选择
            Label(
                title: { Text(gender) },
                icon: { Image(systemName: "person") }
            ).padding()
            Picker(selection: $gender, content: {
                ForEach(dataList, id: \.self) { item in
                    Text(item)
                }
            }) {
                Text("性别")
            }.padding()
            TextEditor(text: $info)
                .padding()
        }
        .padding()
    }
}

#Preview {
    ContentView()
}

可选样式

可以选择的样式有多个,可以一个一个试试看

automatic:

inline:上下滑动选择,还有音效

 

segmented: tab选项

 

menu: 感觉和automatic一样啊

palette: 怎么感觉和segmented一样?

wheel: 感觉和inline一样

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/769284.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【Week-G2】人脸图像生成(DCGAN)--pytorch版本

文章目录 0、遇到的问题1、配置环境 & 导入数据2、定义模型3、训练模型4、什么是DCGAN? 🍨 本文为🔗365天深度学习训练营 中的学习记录博客🍖 原作者:K同学啊 | 接辅导、项目定制 本文环境: 系统环境:…

从搜索框的提示词中再探防抖和节流

前言 最近逛掘金时,看到了一篇文章。发现是我之前写过的一篇文章主题是防抖和节流的,看防抖时没感觉哪里不一样,但是当我看到节流时发现他的节流怎么这么繁琐(・∀・(・∀・(・∀・*)? 抱着疑惑的想法,我仔细拜读了这…

PyCharm 如何设置作者信息

1、点击pycharm右上角的齿轮,选择settings 2、选择editor 3、选择 Editor File and Code Templates 4、选择作者信息的文件类型,中间选择框选择Python Script 5、然后在右边的输入框中输入相关的信息 # -*- coding: utf-8 -*- """ Time …

kotlin接口,前端怎么调用?

文章目录 🎉欢迎来到Java学习路线专栏~探索Java中的静态变量与实例变量 ☆* o(≧▽≦)o *☆嗨~我是IT陈寒🍹✨博客主页:IT陈寒的博客🎈该系列文章专栏:Java学习路线📜其他专栏:Java学习路线 Jav…

构建大数据生态:Sqoop、Hadoop、IDEA和Maven的完整安装与数据预处理指南【实训Day03】

一、Sqoop安装 1 上传安装包并解压缩(在hadoop101上) # cd /opt/software 点击xftp上传sqoop的安装文件sqoop-1.4.6.bin__hadoop-2.0.4-alpha.tar.gz # tar -zxvf sqoop-1.4.6.bin__hadoop-2.0.4-alpha.tar.gz -C /opt/module/ # cd /opt/module/ # mv s…

vue3+vue-router+vite 实现动态路由

文章中出现的代码是演示版本,仅供参考,实际的业务需求会更加复杂 什么是动态路由 什么场景会用到动态路由 举一个最常见的例子,比如说我们要开发一个后台管理系统,一般来说后台管理系统都会分角色登录,这个时候也就涉…

基于Vue.js和SpringBoot的地方美食分享网站系统设计与实现

你好,我是计算机专业的学姐,专注于前端开发和系统设计。如果你对地方美食分享网站感兴趣或有相关需求,欢迎随时联系我。 开发语言 Java 数据库 MySQL 技术 Vue.js SpringBoot Java 工具 Eclipse, MySQL Workbench, Maven 系统展示…

【Spring Boot】关系映射开发(一):一对一映射

关系映射开发(一):一对一映射 1.认识实体间关系映射1.1 映射方向1.2 ORM 映射类型 2.实现 “一对一” 映射2.1 编写实体2.1.1 新建 Student 实体2.1.2 新建 Card 实体 2.2 编写 Repository 层2.2.1 编写 Student 实体的 Repository2.2.2 编写…

AMEYA360代理:海凌科60G客流量统计雷达模块 4T4R出入口绊数计数

数字化时代,不管是大型商城还是各种连锁店,客流统计分析都可以帮助企业更加精准地了解顾客需求和消费行为。 海凌科推出一款专用于客流量统计的60G雷达模块,4T4R,可以实时进行固定范围内的人体运动轨迹检测,根据人体的…

0703_ARM7

练习: 封装exti,cic初始化函数 //EXTI初始化 void hal_key_exti_init(int id,int exticr,int mode){//获取偏移地址int address_offset (id%4)*8;//获取寄存器编号int re_ser (id/4)1;//printf("address_offset%d,re_ser%d\n",address_o…

学会python——用python编写一个电子时钟(python实例十七)

目录 1.认识Python 2.环境与工具 2.1 python环境 2.2 Visual Studio Code编译 3.电子时钟程序 3.1 代码构思 3.2代码实例 3.3运行结果 4.总结 1.认识Python Python 是一个高层次的结合了解释性、编译性、互动性和面向对象的脚本语言。 Python 的设计具有很强的可读性…

软件模型分类及特点

在软件开发的世界里,我们经常会遇到业务模型、系统模型和软件模型这三个层次。这些模型各有特点,相互之间也有着紧密的联系。通过理解这三个层次之间的映射关系,我们能更好地理解和掌握软件开发的全过程 1. 业务模型 业务模型描述了组织的业…

搜维尔科技:Xsens实时动作捕捉,驱动人形机器人操作!

搜维尔科技:http://www.souvr.comhttp://www.souvr.com实时动作捕捉,驱动人形机器人操作! 搜维尔科技:Xsens实时动作捕捉,驱动人形机器人操作!

方向导数和梯度

方向导数和梯度 1 导数的回忆2 偏导数及其向量形式偏导数的几何意义偏导数的向量形式 3 方向导数向量形式几何意义方向导数和偏导的关系 4 梯度5 梯度下降算法 1 导数的回忆 导数的几何意义如图所示: 当 P 0 P_{0} P0​点不断接近 P P P时,导数如下定义…

vue 中使用element-ui实现锚点定位表单

效果图&#xff1a; 代码&#xff1a; html代码&#xff1a; <div class"content-left"><el-tabs :tab-position"left" tab-click"goAnchor"><el-tab-pane v-for"(item,index) in anchorNameList"v-anchor-scroll:ke…

LeetCode 60.排序排列(dfs暴力)

给出集合 [1,2,3,...,n]&#xff0c;其所有元素共有 n! 种排列。 按大小顺序列出所有排列情况&#xff0c;并一一标记&#xff0c;当 n 3 时, 所有排列如下&#xff1a; "123""132""213""231""312""321" 给定…

基于RSA的数字签名设计与实现

闲着没事把大三的实验发一下 这里用的技术和老师要求的略有不同但大体相同 1. RSA算法简介 公钥密码体制中,解密和加密密钥不同,解密和加密可分离,通信双方无须事先交换密钥就可建立起保密通信,较好地解决了传统密码体制在网络通信中出现的问题.另外,随着电子商务的发展,网络…

transformer模型学习路线_transformer训练用的模型

Transformer学习路线 完全不懂transformer&#xff0c;最近小白来入门一下&#xff0c;下面就是本菜鸟学习路线。Transformer和CNN是两个分支&#xff01;&#xff01;因此要分开学习 Transformer是一个Seq2seq模型&#xff0c;而Seq2seq模型用到了self-attention机制&#xf…

Python | Leetcode Python题解之第205题同构字符串

题目&#xff1a; 题解&#xff1a; class Solution:def isIsomorphic(self, s: str, t: str) -> bool:dicts Counter(s)dictt Counter(t) if list(dicts.values()) ! list(dictt.values()):return Falsefor i in range(len(s)):inds list(dicts.keys()).index(s…

【postgresql】 数据类型

数字类型 名字存储尺寸描述范围smallint2字节小范围整数-32768 ~32767integer4字节整数的典型选择-2147483648 ~ 2147483647bigint8字节大范围整数-9223372036854775808 ~ 9223372036854775807decimal可变用户指定精度&#xff0c;精确最高小数点前131072位&#xff0c;以及小…