一、背景

  我们在布局中,经常会遇到视图元素排列时空间不足或者空间过大的情况,在这种场景下面,不同的布局方式有不同的方法:

  绝对布局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被压缩的效果的更多相关文章

  1. 在android4.0中实现View的拖动效果

    实现方法: 首先需要定义一个支持拖动的源组件和一个作为Drop区域的目标组件. 在支持拖动的组件中注册OnTouchListener 或LongClickListener监听事件,构建一个ClipDa ...

  2. android中实现view可以滑动的六种方法续篇(二)

    承接上一篇,上一篇中讲解了实现滑动的第五种方法,如果你还没读过,可点击下面链接: http://www.cnblogs.com/fuly550871915/p/4985482.html 这篇文章现在来 ...

  3. android中实现view可以滑动的六种方法

    在android开发中,经常会遇到一个view需要它能够支持滑动的需求.今天就来总结实现其滑动的六种方法.其实每一种方法的 思路都是一样的,即:监听手势触摸的坐标来实现view坐标的变化,从而实现vi ...

  4. 如何在低api中使用View的属性设置方法如setAlpha等

    ViewPagerTransforms 是一个自定义了各种翻转效果的开源库,其中的各种PageTransformer使用了view的很多属性设置方法如DepthPageTransformer中:? p ...

  5. 详解ExplosionField的使用,实现View的粉碎效果

    小米平板卸载软件的时候,会有一个粉碎的效果,看起来很拉风,GitHub上有一个开源控件可以实现这个效果,我们一起来看看.先来看看效果图: 看起来不错吧,那我们今天就来详细说说ExplosionFiel ...

  6. 《Qt编程的艺术》——8.2.1 在Designer中使用View类

    不幸的是,QDirModel有一个严重的限制:因为view不响应鼠标操作,我们不得不自己建立这些功能.除此之外,每个view中,用户都一次只能选择一个元素.如果你想要允许同时选择多个项目,你也必须自己 ...

  7. android设置view透明度的效果

    android设置view透明度的效果 推荐textView.setBackgroundColor(Color.TRANSPARENT);     第一种方法:在xml文件中设置背景颜色. andro ...

  8. android开发:Android 中自定义View的应用

    大家好我们今天的教程是在Android 教程中自定义View 的学习,对于初学着来说,他们习惯了Android 传统的页面布局方式,如下代码: <?xml version="1.0&q ...

  9. 如何让IOS中的文本实现3D效果

    本转载至 http://bbs.aliyun.com/read/181991.html?spm=5176.7114037.1996646101.25.p0So7c&pos=9       zh ...

  10. 详解实现Android中实现View滑动的几种方式

    注: 本文提到的所有三种滑动方式的完整demo:ScrollDemo 1. 关于View我们需要知道的 (1)什么是View? Android中的View类是所有UI控件的基类(Base class) ...

随机推荐

  1. Python2同时输出中文和变量时中文乱码

    Python2同时输出中文和变量时中文乱码 一.问题描述 最近在学习tensorflow时,突然发现一个问题,python2在输出中文和变量时会出现一点问题,如下图: 可以看到,输出并不是想要的结果, ...

  2. 报表如何批量导出成 excel 文件

    需求说明 报表展现后可以通过工具栏中的导出按钮将当前展现的报表导出成 excel 文件,但是在实际使用中通常会要求报表不需要展现,直接通过一些操作将报表导出成 excel 文件,并且往往会要求批量导出 ...

  3. 实验k8s ————— k8s 搭建[一]

    前言 以前学习k8s记录的.这里简单整理一下搭建,当时是我们学习环境的搭建,正式环境得专门的运维人员来,毕竟人家考虑的东西不一样. 正文 这里用kubeadm进行搭建,更加详细信息,在这里: http ...

  4. bookstack书栈网docker搭建

    准备好数据后,直接运行以下命令即可. docker run -d --name bookstack \ --restart always \ --privileged=true\ -p 8181:81 ...

  5. 使用纯c#在本地部署多模态模型,让本地模型也可以理解图像

    之前曾经分享过纯c#运行开源本地大模型Mixtral-8x7B 当时使用的是llamasharp这个库和Mixtral的模型在本地部署和推理,前段时间我看到llamasharp更新到了0.11.1版本 ...

  6. 二叉查找树的实现C/C++

    二叉查找树是一种关键字有序存放的二叉树.在不含重复关键字的二叉查找树中,关键字"较小"的节点一定在关键字"较大"的节点的左子树中,"较小"一 ...

  7. 重磅官宣:Nacos2.0 发布,性能提升 10 倍

    简介: 继 Nacos 1.0 发布以来,Nacos 迅速被成千上万家企业采用,并构建起强大的生态.但是随着用户深入使用,逐渐暴露一些性能问题,因此我们启动了 Nacos 2.0 的隔代产品设计,时隔 ...

  8. 2018-2-13-win10-uwp-修改CalendarDatePicker图标颜色

    title author date CreateTime categories win10 uwp 修改CalendarDatePicker图标颜色 lindexi 2018-2-13 17:23:3 ...

  9. 2018-11-19-WPF-使用-SharpDX-在-D3DImage-显示

    title author date CreateTime categories WPF 使用 SharpDX 在 D3DImage 显示 lindexi 2018-11-19 15:38:35 +08 ...

  10. uniapp+vue3聊天室|uni-app+vite4+uv-ui跨端仿微信app聊天语音/朋友圈

    原创研发uniapp+vue3+pinia2跨三端仿微信app聊天模板Uniapp-Wechat. uni-vue3-wchat基于uni-app+vue3+pinia2+uni-ui+uv-ui等技 ...