首页 > 其他分享 >swiftUI

swiftUI

时间:2024-07-12 17:29:55浏览次数:12  
标签:ContentView 示例 视图 SwiftUI World swiftUI Hello

SwiftUI 是苹果推出的一种现代化方式,用于创建跨所有 Apple 平台的用户界面。它通过声明性语法简化了 UI 的开发流程。下面是一个基本的 SwiftUI 示例,展示了如何使用 SwiftUI 构建一个简单的 "Hello World" 应用。

示例步骤

1. 创建一个新的 SwiftUI 项目

打开 Xcode,选择 "新建项目" 并选择 "App" 模板。在创建项目前,确保使用 "SwiftUI" 作为用户界面,语言选择 "Swift"。

2. 基本的 "Hello World" 示例

创建项目后,Xcode 会生成一个基本的 SwiftUI 文件。以下是如何使用 SwiftUI 实现一个最简单的 "Hello World" 示例:

import SwiftUI

@main
struct HelloWorldApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

struct ContentView: View {
    var body: some View {
        Text("Hello, World!")
            .padding()
            .font(.largeTitle)
            .foregroundColor(.blue)
    }
}

 

解释代码

  • @main:

    @main 是 Swift 应用的入口点。在 SwiftUI 应用中, @main 标记的结构体遵循 App 协议,定义了应用的主界面和行为。

  • HelloWorldApp:

    这是应用的主入口,定义了应用启动时创建的场景(窗口)。

  • WindowGroup:

    WindowGroup 定义了一个窗口内容。每个 WindowGroup都包含一个 ContentView

  • ContentView:

    这是一个遵循 View 协议的结构体,定义了用户界面。

  • Text:

    Text 是一个显示静态文本的视图。你可以附加多个修饰符(例如 paddingfont, 和 foregroundColor)来修改文本的外观。

增强示例:带有按钮的示例

我们可以进一步增强这个示例,通过添加一个按钮,实现点击按钮改变文本内容的功能。

import SwiftUI

@main
struct HelloWorldApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

struct ContentView: View {
    @State private var message = "Hello, World!"

    var body: some View {
        VStack {
            Text(message)
                .padding()
                .font(.largeTitle)
                .foregroundColor(.blue)
                
            Button(action: {
                message = "Button Clicked!"
            }) {
                Text("Click Me")
                    .padding()
                    .background(Color.blue)
                    .foregroundColor(.white)
                    .cornerRadius(10)
            }
        }
    }
}

 

解释新增的代码

  • @State:

    @State 属性包装器用于声明视图中的状态变量。状态变量变化时视图会自动更新。

  • VStack:

    VStack 是垂直堆栈视图,安排其子视图垂直排列。

  • Button:

    Button 表示一个按钮视图。action 闭包在按钮点击时执行。

通过以上步骤与代码,你就可以实现一个简单的 SwiftUI 视图,并体验 SwiftUI 带来的简洁与高效的开发体验。如果你继续深入学习 SwiftUI,会发现更多丰富的特性和强大功能。

标签:ContentView,示例,视图,SwiftUI,World,swiftUI,Hello
From: https://www.cnblogs.com/chglog/p/18299044

相关文章

  • swiftui中TabView使用,以及Tab使用注意
    TabView官方文档:TabView|AppleDeveloperDocumentationTab官网文档:Tab|AppleDeveloperDocumentation使用交互式用户界面元素在多个子视图之间切换的视图。也就是手机底部的几个导航菜单一样,但是注意官方给的例子里面有使用Tab组件的,但是这个Tab组件注意:暂时只支持bet......
  • SwiftUI 热门开源库推荐第1期 - 凡人程序猿 - iOS开发
    大家好,周末给大家分享几个我在用已久的GitHub开源库,这些开源库使用简单,功能强大,使用好它们能够为我们节省大量的开发时间。话不多说,直接上库。1、PopupViewgithub项目地址:https://github.com/exyte/PopupView这个开源库在GitHub上有3.2K个赞。它是一款功能全面且好用......
  • swiftUI使用VideoPlayer和AVPlayer播放视频
    使用VideoPlayer包播放视频:https://github.com/wxxsw/VideoPlayer提供一些可供测试的视频链接,不保证稳定可用哦:https://vfx.mtime.cn/Video/2019/06/15/mp4/190615103827358781.mp4https://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4https://vfx.mtime.cn/Video/2019/......
  • SwiftUI中Popover的使用(弹出方式,箭头位置,如何退出)
    在iOS中,popover是出现在现有内容顶部的UI元素,通常用于在上下文中向用户呈现新视图。与其他占用整个屏幕的视图控制器不同,popover出现在一个较小的、集中的区域,从而使用户能够在必要时与popover外的应用程序的其他部分进行交互。这是一种有效的方式来显示额外的信息或选项,而......
  • SwiftUI中SafeArea的管理与使用(ignoresSafeArea, safeAreaPadding, safeAreaInset)
    SafeArea是指不与视图控制器提供的导航栏、选项卡栏、工具栏或其他视图重叠的内容空间。在UIKit中,开发人员需要使用safeAreaInsets或safeAreaLayoutGuide来确保视图被放置在界面的可见部分。SwiftUI彻底简化了上述过程,除非开发者明确要求视图突破安全区域的限制,否则SwiftU......
  • SwiftUI中AsyncImage的使用(一个高效的异步下载图片组件)
    iOS开发者经常会遇到需要在应用中显示网络图像的场景,无论是获取和显示用户头像,展示产品图像,等等。在原来的UIKit中,如果我们要用系统的API还是稍微有点麻烦,很多开发的朋友都选择了第三方的框架去处理网络图片的请求缓存等等。AsyncImage是SwiftUI中一个强大的功能,它简化了在......
  • SwiftUI中的组合动画(Simultaneous, Sequenced, Exclusive)
    了解了常见的几种手势后,接下来我们了解一下组合手势的操作,当一个视图存在多个手势的时候,为了避免手势冲突,SwiftUI提供了自定义手势的方法,比如同时进行,顺序进行等等。以下是一些常见的多种手势组合使用方式:simultaneously(with:):同时使用多个手势,使它们可以同时响应用户的......
  • SwiftUI中的手势(TapGesture、LongPressGesture、GestureState的使用)
    手势操作在App中可谓是用途非常广泛了,常规的手势修饰符有TapGesture点击手势、LongPressGesture长按手势、DragGesture拖拽手势,MagnificationGesture放缩手势和RoationGesture旋转手势。和常规的修饰符方法类似,只要将手势修饰符添加到视图中,系统就会自动识别用户的操作,并......
  • SwiftUI中的手势(DragGesture拖拽手势及Drag动画组件)
    上一篇文章我们了解了如何使用.gesture修饰符和@GestureState属性包装器,让我们看看另一种常见的手势:DragGesture拖拽手势。下面先看个效果图:这个效果中,我们实现了一个Text文本,并添加了拖拽手势,可以拖动到屏幕的任意位置,松手后停留在目标位置,而非回到原来的起点位置。UI......
  • SwiftUI State,Binding 状态管理
    代码////ContentView.swift//SwiftUIState////CreatedbyCHENHaoon2024/5/8.//importSwiftUIstructContentView:View{@StateprivatevarisPlaying=false@StateprivatevarclickNumber1=0@StateprivatevarclickNumber2=0......