swiftui中NavigationStack布局navigationBarTitleDisplayMode作用,以及内容顶部空白区域解决办法

写了一个小demo用于学习NavigationStack和toolbar/ToolbarItem知识,但是在写一个瀑布流布局的时候,设置了顶部的toolbar,然后内容区域的顶部出现了一大片空白区域,这样的效果并不是很美观很好看,所以就想着研究解决一下,下面是我的测试代码:

//
//  Hongshu.swift
//  SwiftBook
//
//  Created by Song on 2024/7/6.
//import SwiftUIstruct Hongshu: View {var body: some View {NavigationStack {ScrollView(content: {HStack(content: {VStack(content: {Image("juzi").resizable().aspectRatio(contentMode: .fit)Image("lizhi").resizable().aspectRatio(contentMode: .fit)Spacer()})VStack(content: {Image("putao").resizable().aspectRatio(contentMode: .fit)Image("xigua").resizable().aspectRatio(contentMode: .fit)Spacer()})}).padding(.horizontal)}).toolbar {ToolbarItem(placement: .principal, content: {HStack {Text("首页")Text("附近")Text("推荐")}})}}}
}#Preview {Hongshu()
}

其实这个问题的解决办法就是添加一行:

.navigationBarTitleDisplayMode(.inline)

可以看到空白区域就消失了: 

那这个navigationBarTitleDisplayMode是干什么用的呢?

用于设置视图的导航栏标题的显示模式。它的值是一个枚举类型.automatic.inline.large

看官方文档说明:navigationBarTitleDisplayMode(_:) | Apple Developer Documentation

不同的样式展示:

.automatic:这是默认样式,会自动放在左侧显示

.inline:中间标题,类似微信标题

.large:和automatic类似

那可能就有异味了:我也没有设置navigationBarTitle这个内容啊,为啥就对我的内容布局有影响呢?因为默认使用的automatic,并且当你设置了ToolbarItem(placement: .principal 的时候,即便你设置了navigationBarTitle,如果你的navigationBarTitleDisplayMode为inline,navigationBarTitle也不会显示,但是如果你设置了navigationBarTitleDisplayMode为automatic,它还是会占位置的:

因为默认是automatic,而且你没有设置navigationBarTitle,所以这个位置就是默认空着,占一个空白区域。

所以只要设置.navigationBarTitleDisplayMode(.inline),这个空白区域就消失了:

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

科普文:一文搞懂SpringBoot(狂神说Java)

1、Hello,World! 1.1、SpringBoot简介 回顾什么是Spring Spring是一个开源框架,2003 年兴起的一个轻量级的Java 开发框架,作者:Rod Johnson 。 Spring是为了解决企业级应用开发的复杂性而创建的,简化开发。 Spring是…

clickhouse学习笔记(五)SQL操作

目录 一、增 二、删改 三、查询以及各种子句 1、with子句 a、表达式为常量 b、表达式为函数调用 c、表达式为子查询 2、from子句 3、array join子句 a、INNER ARRAY JOIN b、LEFT ARRAY JOIN c、数组的一些函数 groupArray groupUniqArray arrayFlatten splitBy…

2005-2023年各省居民人均消费支出、城镇居民人均消费支出、农村居民人均消费支出数据(无缺失)

2005-2023年各省居民人均消费支出、城镇居民人均消费支出、农村居民人均消费支出数据(无缺失) 1、时间:2005-2023年 2、来源:国家统计局、统计年鉴 3、范围:31省 4、指标:全体居民人均消费支出、城镇居…

Windows netstat命令详解,Windows查看网络连接

「作者简介」:冬奥会网络安全中国代表队,CSDN Top100,就职奇安信多年,以实战工作为基础著作 《网络安全自学教程》,适合基础薄弱的同学系统化的学习网络安全,用最短的时间掌握最核心的技术。 netstat 常用来…

rocketmq实现限流

目录 问题背景 技术方向 方案确认 消息队列(√) 分布式锁() 方案实现 监控方向 业务方向 问题背景 公司邮件服务token有 分钟内超200封的熔断机制,当前token被熔断后,系统发邮件操作会被忽略&…

责任链模式(大话设计模式)C/C++版本

责任链模式 C #include <iostream> #include <memory>using namespace std; // 请求类 struct Request {std::string requestType; // 请求类型int number; // 该请求类型的数量std::string requestContent; // 请求内容 };// 抽象经理类 clas…

MySQL学习记录 —— 십칠 CentOS7.9环境下的MySQL8.4 安装和配置

文章目录 1、安装和配置2、MySQL 包位置3、主要程序介绍 本篇开始在之前mysql博客的基础上继续延伸&#xff0c;适合有一定基础的mysql使用者阅读 环境 &#xff1a;CentOS 7.9 root 用户&#xff0c;MySQL 8.4 1、安装和配置 看一下当前系统版本 cat /etc/redhat-release应当…

前端重点之:Vue+websocket通信详细用法和websocket心跳机制的使用,websocket断开实时监测,websocket实时通信

今年年初找工作,好多gou面试官总喜欢问关于websocket通信的使用方式,此次又用到了,在此做个总结:主要包含websocket的具体使用方法,和重点:(心跳机制的使用),就是主要是前端实时监测websocket是否有断连和数据的处理 在前端开发中,WebSocket 是一种常见的技术,用于…

众所周知沃尔玛1P是怎么运营?

​​沃尔玛的1P模式&#xff0c;即第一方供应商模式&#xff0c;是其独特的采购策略。在这种模式下&#xff0c;供应商先将商品卖给沃尔玛&#xff0c;由沃尔玛负责库存管理和销售。沃尔玛通过强大的采购和物流能力控制库存&#xff0c;确保商品品质&#xff0c;为客户提供更加…

FPGA问题

fpga 问题 第一道坎&#xff0c;安装软件&#xff1b;没有注册&#xff0c;无法产生sop文件&#xff0c;无法下载 没有相应的库的quartus ii版本&#xff0c;需要另下载 第二道坎&#xff0c;模拟器的下载&#xff0c;安装&#xff1b; 第三道&#xff0c;verilog 语法&#x…

deepspeed huggingface传入参数 optimizer和lr_scheduler测试

Trainer中 首先&#xff1a; WarmupDecayLR --lr_scheduler_type linear WarmupLR --lr_scheduler_type constant_with_warmup 1 TrainArgument不传lr_scheduler_type、optim&#xff0c;warmup_steps15 ds config文件中定义如下&#xff1a; 注意&#xff1a;如果不在Trai…

LangChain(四)工具调用的底层原理!给大模型按上双手吧!(新手向)

背景 经过前面三篇的内容&#xff0c;我想大家对于大模型的构建、Langchain的优势、Chain的构建有了相当程度的理解&#xff08;虽然只是最简单的示例&#xff0c;但是足够有代表性&#xff09;。 后续Chain的使用将会更加丰富多彩&#xff0c;您会了解Langchain开发的大模型…

14-31 剑和诗人5 - 使用 AirLLM 和分层推理在单个 4GB GPU 上运行 LLama 3 70B

利用分层推理实现大模型语言(LLM) 大型语言模型 (LLM) 领域最近取得了显著进展&#xff0c;LLaMa 3 70B 等模型突破了之前认为可能实现的极限。然而&#xff0c;这些模型的庞大规模给其部署和实际使用带来了巨大挑战&#xff0c;尤其是在资源受限的设备上&#xff0c;例如内存…

怎么压缩pdf文件的大小?减小PDF文件大小的四种方法

怎么压缩pdf文件的大小&#xff1f;文件大小不仅影响传输速度&#xff0c;还可能涉及存储空间的管理。当处理大型PDF文件时&#xff0c;可能会面临电子邮件附件限制或云存储容量不足的问题。此外&#xff0c;过大的文件在浏览和加载时也会导致延迟&#xff0c;影响阅读体验。这…

3款自己电脑就可以运行AI LLM的项目

AnythingLLM、LocalGPT和PrivateGPT都是与大语言模型&#xff08;LLM&#xff09;相关的项目&#xff0c;它们允许用户在本地环境中与文档进行交互&#xff0c;但它们在实现方式和特点上存在一些差异。AnythingLLM使用Pinecone和ChromaDB来处理矢量嵌入&#xff0c;并使用OpenA…

【C语言】return 关键字详解

在C语言中&#xff0c;return是一个关键字&#xff0c;用于从函数中返回值或者结束函数的执行。它是函数的重要组成部分&#xff0c;负责将函数的计算结果返回给调用者&#xff0c;并可以提前终止函数的执行。 主要用途和原理&#xff1a; 返回值给调用者&#xff1a; 当函数执…

【论文阅读】-- Visual Traffic Jam Analysis Based on Trajectory Data

基于轨迹数据的可视化交通拥堵分析 摘要1 引言2 相关工作2.1 交通事件检测2.2 交通可视化2.3 传播图可视化 3 概述3.1 设计要求3.2 输入数据说明3.3 交通拥堵数据模型3.4 工作流程 4 预处理4.1 路网处理4.2 GPS数据清理4.3 地图匹配4.4 道路速度计算4.5 交通拥堵检测4.6 传播图…

掌握【Python异常处理】:打造健壮代码的现代编程指南

目录 ​编辑 1. 什么是异常&#xff1f; 知识点 示例 小李的理解 2. 常见的内置异常类型 知识点 示例 小李的理解 3. 异常机制的意义 知识点 示例 小李的理解 4. 如何处理异常 知识点 示例 小李的理解 5. 抛出异常 知识点 示例 小李的理解 6. Python内置…

Springboot整合Jsch-Sftp

背景 开发一个基于jsch的sftp工具类&#xff0c;方便在以后的项目中使用。写代码的过程记录下来&#xff0c;作为备忘录。。。 Maven依赖 springboot依赖 <parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-par…

codeforces 1633A

文章目录 1. 题目链接2. 题目代码正确代码错误代码 3. 题目总结 1. 题目链接 Div. 7 2. 题目代码 正确代码 #include<iostream> using namespace std; int main(){int testCase;cin >> testCase;while(testCase --){int ingeter;cin >> ingeter;if(!(inget…