SwiftUI Stack中的View被压缩的效果
一、背景
我们在布局中,经常会遇到视图元素排列时空间不足或者空间过大的情况,在这种场景下面,不同的布局方式有不同的方法:
绝对布局frame:纯靠计算过程控制,获取父视图的大小,根据需求,计算自己需要的大小,并设置到frame上去
iOS autolayout:这里更先进一点,将视图中的约束预设进布局的DSL中,当视图的尺寸发生变化的时候,根据DSL描述修改视图的尺寸,这个是自动化完成的
swiftui:目前来看可以使用frame的最大值最小值理想值完成约束预设,此外还可以通过view的modifier进行预设
二、例子
struct CharView: View {
var body: some View {
HStack {
}.frame(minWidth: 50, maxWidth: 100, minHeight: 50, maxHeight: 100)
.background(.green)
.border(.red)
.overlay {
GeometryReader { proxy in
Text("\(proxy.size.width) x \(proxy.size.height)")
}
}
}
}
struct WordView: View {
var body: some View {
HStack(spacing: 0) {
CharView().layoutPriority(1.0)
CharView().layoutPriority(2.0)
}
.frame(width: 160, height: 100)
.fixedSize(horizontal: false, vertical: true)
.border(.yellow)
}
}

这边有两个view,分别设置的最大宽度100,最小宽度50; 同时父容器是160,那么两个容器放不下,这个时候,会优先布局优先级高的容器,所以右边的视图是100, 左边视图是60
这里的优先级和Flex中的 flex-basis不一样,不是按照比例分配的
SwiftUI Stack中的View被压缩的效果的更多相关文章
- 在android4.0中实现View的拖动效果
实现方法: 首先需要定义一个支持拖动的源组件和一个作为Drop区域的目标组件. 在支持拖动的组件中注册OnTouchListener 或LongClickListener监听事件,构建一个ClipDa ...
- android中实现view可以滑动的六种方法续篇(二)
承接上一篇,上一篇中讲解了实现滑动的第五种方法,如果你还没读过,可点击下面链接: http://www.cnblogs.com/fuly550871915/p/4985482.html 这篇文章现在来 ...
- android中实现view可以滑动的六种方法
在android开发中,经常会遇到一个view需要它能够支持滑动的需求.今天就来总结实现其滑动的六种方法.其实每一种方法的 思路都是一样的,即:监听手势触摸的坐标来实现view坐标的变化,从而实现vi ...
- 如何在低api中使用View的属性设置方法如setAlpha等
ViewPagerTransforms 是一个自定义了各种翻转效果的开源库,其中的各种PageTransformer使用了view的很多属性设置方法如DepthPageTransformer中:? p ...
- 详解ExplosionField的使用,实现View的粉碎效果
小米平板卸载软件的时候,会有一个粉碎的效果,看起来很拉风,GitHub上有一个开源控件可以实现这个效果,我们一起来看看.先来看看效果图: 看起来不错吧,那我们今天就来详细说说ExplosionFiel ...
- 《Qt编程的艺术》——8.2.1 在Designer中使用View类
不幸的是,QDirModel有一个严重的限制:因为view不响应鼠标操作,我们不得不自己建立这些功能.除此之外,每个view中,用户都一次只能选择一个元素.如果你想要允许同时选择多个项目,你也必须自己 ...
- android设置view透明度的效果
android设置view透明度的效果 推荐textView.setBackgroundColor(Color.TRANSPARENT); 第一种方法:在xml文件中设置背景颜色. andro ...
- android开发:Android 中自定义View的应用
大家好我们今天的教程是在Android 教程中自定义View 的学习,对于初学着来说,他们习惯了Android 传统的页面布局方式,如下代码: <?xml version="1.0&q ...
- 如何让IOS中的文本实现3D效果
本转载至 http://bbs.aliyun.com/read/181991.html?spm=5176.7114037.1996646101.25.p0So7c&pos=9 zh ...
- 详解实现Android中实现View滑动的几种方式
注: 本文提到的所有三种滑动方式的完整demo:ScrollDemo 1. 关于View我们需要知道的 (1)什么是View? Android中的View类是所有UI控件的基类(Base class) ...
随机推荐
- CentOS 6.5 LAMP分主机平台的搭建及测试
CentOS 6.5 LAMP分主机平台的搭建及测试 看似非常之完备,转来抽空测试学习 原文地址:http://www.it165.net/os/html/201403/7595.html 前言 ...
- 重新整理.net core 计1400篇[六] (.net core 一个简易版的依赖注入容器 )
前言 我们了解到一个依赖注入的形式是: 注入依赖服务:var root = new Cat().Register<IFoo, Foo>(Lifetime.Transient); 获取对应的 ...
- Greenplum Jdbc 调用 SETOF refcursor
最近公司需要用Greenplum,在调用 jdbc的时候遇到了一些问题.由于我们前提的业务都是使用 sqlserver,sqlserver的 procedure 在前端展示做数据源的时候才用的非常多, ...
- kong管理界面konga的安装
kong网关自身的管理界面属于付费的应用,而第三方界面又非常少,konga算是相对比较好的一款了,虽然也有一些问题,但整体的功能还比较全,github仓库为:https://github.com/pa ...
- mac版本vscode窗口崩溃crashed
1.截图 出现时机 当安装依赖的时候大概率会出现,甚至安装一次依赖会出现几次 解决 具体原因未知 重新启动电脑以及退出软件都不能解决 去官网重新下载,重新安装问题解决
- 高效使用Java构建工具|Maven篇|云效工程师指北
简介:高效使用Java构建工具|Maven篇.众所周知,当前最主流的Java构建工具为Maven/Gradle/Bazel,针对每一个工具,我将分别从日常工作中常见的场景问题切入,例如依赖管理.构建 ...
- 从托管到原生,MPP架构数据仓库的云原生实践
简介:本文介绍了云原生数据仓库产品AnalyticDB PostgreSQL从Cloud-Hosted到Cloud-Native的演进探索,探讨为了实现真正的资源池化和灵活售卖的底层设计和思考,涵盖 ...
- Region-区域
定义Region的方式有两种: 一种是在XAML定义 RegionManager.RegionName(XAML) 一.View代码 1 <Viewbox Grid.Column="1 ...
- dotnet 读 WPF 源代码笔记 渲染层是如何将字符 GlyphRun 画出来的
从业务代码构建出来 GlyphRun 对象,在 WPF 的渲染层里,如何利用 GlyphRun 提供的数据将字符在界面呈现出来.本文将和大家聊聊从 WPF 的渲染层获取到 GlyphRun 数据,到调 ...
- 4.k8s-配置网络策略 NetworkPolicy
一.基本了解 官方文档:https://kubernetes.io/zh-cn/docs/concepts/services-networking/network-policies/基本了解: 1.网 ...