SwiftUI制作View可嵌套组件

SwiftUI制作View可嵌套组件

  • 了解嵌套组件制造原理
  • 制作一套嵌套组件
  • 掌握配置嵌套组件的preview的方法
  • 如何初始化嵌套参数
  • 基础构造
struct ENavigationView<Content: View>: View {

    let viewBuilder: () -> Content

    var body: some View {
        NavigationView {
            VStack {
                viewBuilder()
                    .navigationBarTitle("My App")
            }
        }
    }

}

struct ENavigationView_Previews: PreviewProvider {
    static var previews: some View {
        ENavigationView {
            Text("Preview")
        }
    }
}

struct ContentView: View {

    var body: some View {
        ENavigationView {
            Text("My Text")
        }
    }

}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
  • 初始化参数
struct ENavigationView<Content: View>: View {

    let viewBuilder: () -> Content
    @Binding var oneFlag:Int
init(oneFlag:Int,, @ViewBuilder content: @escaping () -> Content)
    {
        self.oneFlag = oneFlag
        self.viewBuilder = content
    }
    var body: some View {

        NavigationView {
            VStack {
                viewBuilder()
                    .navigationBarTitle("My App")
            }
        }
    }

}

struct ENavigationView_Previews: PreviewProvider {
    static var previews: some View {
        ENavigationView {
            Text("Preview")
        }
    }
}

struct ContentView: View {
@State var oneFlag = 1
    var body: some View {
        ENavigationView(oneFlag:self.oneFlag) {
            Text("My Text")
        }
    }

}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

原文地址:https://www.cnblogs.com/liuxiaokun/p/12677007.html

时间: 2024-10-11 11:39:42

SwiftUI制作View可嵌套组件的相关文章

【REACT NATIVE 系列教程之十三】利用LISTVIEW与TEXTINPUT制作聊天/对话框&&获取组件实例常用的两种方式

本站文章均为 李华明Himi 原创,转载务必在明显处注明: 转载自[黑米GameDev街区] 原文链接: http://www.himigame.com/react-native/2346.html 本篇Himi来利用ListView和TextInput这两种组件实现对话.聊天框. 首先需要准备的有几点:(组件的学习就不赘述了,简单且官方有文档) 1. 学习下 ListView: 官方示例:http://reactnative.cn/docs/0.27/tutorial.html#content

使用CALayer制作View的辉光效果

使用CALayer制作View的辉光效果 实现以下的辉光效果: 思路是这样子的: 1. 创建好需要实现辉光效果的View 2. 对这个View进行截图 3. 将这个截图重新添加进View中 4. 对这个截图实现改变透明度的动画 ViewController.m // // ViewController.m // // Copyright (c) 2013 Nick Jensen. All rights reserved. // #import "ViewController.h" #i

iOS 制作view渐变的效果CAGradientLayer

有时候我们需要在view中加入渐变的效果来让它看起来有玻璃质感,可以使用Core Animation框架中提供的CAGradientLayer来实现. 代码如下:首先添加QuartzCore.framework然后加入如下代码: #import <QuartzCore/QuartzCore.h> - (CAGradientLayer *)shadowAsInverse { CAGradientLayer *newShadow = [[[CAGradientLayer alloc] init] 

vue嵌套组件的生命周期

vue嵌套组件的生命周期 问:有A.B.C三个组件,A为B的父组件,B为C的父组件,它们的创建和挂载顺序是怎样的?即(beforeCreate/created,beforeMounte/mounted)的执行顺序 代码演示 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewpo

【Unity】3.2 利用预设(Prefab)制作可复用的组件

分类:Unity.C#.VS2015 创建日期:2016-04-02 一.简介 预制体(Prefab,也叫预设)是"存储在工程视图(Project View)中"的一种特殊的资源,是一种可重复使用的游戏对象(GameObject)的容器. 如果在Project中有多个预制体(Prefab),为了容易查找,可将这些预制体全部保存到Project视图中Assets文件夹的Prefabs子文件夹下. Prefabs子文件夹下的的所有预制体都可以放入到多个场景中,而且即使在同一个场景中仍然可以

vue2.0嵌套组件之间的通信($refs,props,$emit)

vue的一大特色就是组件化,所以组件之间的数据交互是非常重要,而我们经常使用组件之间的通信的方法有:props,$refs和emit. 初识组件之间的通信的属性和方法 props的使用 子组件使用父组件的数据,使用vue的属性props. 当我们在父组件parent里面嵌套一个子组件son的时候,如果我们需要使用父组件的数据的时候,我们可以在子组件标签上面绑定一个属性,然后在子组件里面通过props来调用这个属性,就可以使用这个数据了. //父组件 <sonPart :list="list

view,视图组件

<?xml version="1.0" encoding="utf-8"?><GridLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" andr

Android 获取View中的组件

可以把这个view强转成ViewGroup对象,再通过getChildAt(0),getChildAt(1) 获取之后AddView可能会报错:IllegalStateException: The specified child already has a parent问题解决办法 最近遇到一个很让人头疼的问题,使用viewpager动态添加页面或者删除页面时出现了问题(java.lang.IllegalStateException: The specified child already ha

JavaPersistenceWithHibernate第二版笔记-第五章-Mapping value types-004嵌套组件的注解AttributeOverrides

一.数据库 二.代码 1. 1 package org.jpwh.model.advanced; 2 3 import javax.persistence.AttributeOverride; 4 import javax.persistence.AttributeOverrides; 5 import javax.persistence.Column; 6 import javax.persistence.Embeddable; 7 import javax.validation.constr