【AutoLayout案例04-游戏图片-按钮适配 Objective-C语言】

一、好,我们再看一个案例,

通知

刚才,这个案例,

通知

这么一个案例

通知

这个案例,是什么意思呢,

通知

这里给大家做一个3.5英寸、4.0英寸的屏幕适配,

因为我们这里图片,只有一个,就是4英寸的这么一个图片

什么意思呢,要求我们在3.5英寸的屏幕、和4英寸的屏幕的时候,都能正常显示这个图片,

那么,先给大家做个什么呢,没有屏幕适配的时候,是什么样子

再让大家看一下,这个屏幕适配以后,的这么一个样子,

通知

下面,我把这个思路,再给大家捋一下

因为我们只做3.5英寸、4英寸的适配吗,所以说,这里,

1)先把控制器改成4英寸,因为我们图片,没有更大的图片了

2)再一个,就是我们设置适配的一个大致思路,首先,设置图片框水平居中,垂直居中

3)设置图片距离左右是0,高度为568

4)修改距离左右为-16(或者把Constraint勾去掉,左右依然设置为0)

5)适配第一个按钮(设置按钮的大小,距离左边5,垂直居中对齐,然后修改按钮的垂直对齐时的constant值)。

6)依次适配每个按钮,两个按钮在同一条水平线上是要设置垂直居中

通知
通知

新建一个项目

通知

Name:007游戏首页图片屏幕适配

通知

看看

通知

先把控制器改成4英寸的

然后,在控制器里面放一个图片框

通知

让这个图片框填满整个屏幕

通知

是这个

通知

home_bg

好,拷过来

通知

把这个拷过来以后,接下来,我们看一下,在我们这个控制器里面

通知

在这个图片框中,设置一下图片,是那个home_bg

通知

在当前,4英寸的这个屏幕上,我们把它改成iPhone5S

通知

在4英寸屏幕下,因为这个图片本身,就是4英寸的大小

然后呢,在我们这个4英寸的屏幕下,是不是显示是刚刚好

这里显示,是不是刚刚好

然后,再把它改成我们的3.5英寸,给大家看一下

然后呢,我把这里的启动,改成我们的iPhone4S

通知

command + R

通知

看到啥了

是不是下面这边,短了不少

上面这边,是不是还是留着,长这么多啊

看到了吗

通知

下边短了不少,上边是不是留出来不少空白啊

你说,这样不行吗

这样不行吧

这样是不是,我们下边这些按钮,就不全了吧

按钮都不全了

我们希望的效果,是什么效果呢

我们希望这里在iPhone5S、iPhone4S、在4英寸、3.5英寸下面

运行效果是什么效果呢,我们希望是这样的效果

如果说,我们现在是4英寸的主机

通知

这时候,会把我们整个这个图片,都显示出来

通知

如果是3.5英寸的屏幕,这个时候,怎么显示呢,

只显示中间这部分,就够了,

通知

这个美工做图,其实它还是挺聪明的

通知

上边是不是一堆砖头

下边是不是一堆地板

这堆地板,是不是要和不要,没啥关系

你在4英寸的屏幕上,你把它整个儿都显示出来,是不是也挺好的

你到3.5英寸下的时候,你把这个上面砖头去几块儿,下边这个地板少几块儿,是不是只显示中间这部分,也可以吧

这也是一种思路吗,这也是一种思路

所以,我们就用这种思路,做一下这个屏幕适配

我们怎么做呢,

二、屏幕适配

1.知道我现在在3.5英寸下、4英寸下、屏幕适配的思路吧

1)在4英寸下,显示整个图片

2)在3.5英寸下,只显示中间那一部分,

把上面的砖头,去掉,不要它了

把下面的地板,也去掉,不要它了

通知

你看看,在3.5英寸的屏幕下,是如何显示的

通知

在3.5英寸下,砖头一堆,下面的按钮,是不是少了

这样你就不合适了吧

我把上边的砖头去了,把下边的地板去一部分,中间的按钮,正常显示

我要的是这样的效果

2.首先,选中这个图片框

通知

让这个图片框,是不是永远是居中显示啊

无论手机怎么做,是不是它永远是居中显示啊

好,我们选中这个图片框,设置它的约束

通知

让它,水平居中、垂直居中

通知

然后,把它勾上,点增加

通知

设完水平居中、垂直居中以后,这里把它更新一下frame

通知

这里的警告,给它解决一下

通知

点击Fix Misplacement

解决完毕以后

通知

解决完毕以后,看到啥了,是不是由于这个图片本身是比较大的,直接是不是放到很大很大了

这样做,肯定不是我们想要的吧

我们要的是这个图片,距离手机屏幕两边是0,这个图片,别超过手机宽度,

这个图片,距离手机两边,是不是都是0啊

那我们就设置一下,注意看

再选中这张图片

通知

然后,让它设置距离左右的距离

通知

先把这个勾去掉

距离左边、右边的竖线选上

通知

把这个下拉菜单打开,看一下,选上View

数字改成0

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

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

相关文章

基于大数据+django+mysql的学习资源推送系统的设计与实现(含报告+源码+指导)

本系统为了数据库结构的灵活性所以打算采用MySQL来设计数据库,而Python技术, B/S架构则保证了较高的平台适应性。文中主要是讲解了该系统的开发环境、要实现的基本功能和开发步骤,并主要讲述了系统设计方案的关键点、设计思想。 由于篇幅限制…

2.神经网络的实现

创建神经网络类 import numpy # scipy.special包含S函数expit(x) import scipy.special # 打包模块 import pickle# 激活函数 def activation_func(x):return scipy.special.expit(x)# 用于创建、 训练和查询3层神经网络 class neuralNetwork:# 初始化神经网络def __init__(se…

【数据分析】统计量

1. 均值、众数描述数据的集中趋势度量,四分位差、极差描述数据的离散程度。 2. 标准差、四分位差、异众比率度量离散程度,协方差是度量相关性。 期望值分别为E[X]与E[Y]的两个实随机变量X与Y之间的协方差Cov(X,Y)定义为: 从直观上来看&…

Vue2向Vue3过度核心技术自定义指令

目录 1 自定义指令1.指令介绍2.自定义指令3.自定义指令语法4.指令中的配置项介绍5.代码示例6.总结 2 自定义指令-指令的值1.需求2.语法3.代码示例 3 自定义指令-v-loading指令的封装1.场景2.需求3.分析4.实现5.准备代码 1 自定义指令 1.指令介绍 内置指令:v-html、v…

channel并发编程

不要通过共享内存通信,要通过通信共享内存。 channel是golang并发编程中一种重要的数据结构,用于多个goroutine之间进行通信。 我们通常可以把channel想象成一个传送带,将goroutine想象成传送带周边的人,一个传送带的上游放上物品…

四信重磅推出5G RedCap AIoT摄像机 RedCap轻量级5G终端新品首发!

6月6日,四信受邀出席移动物联网高质量发展论坛,并在移动物联网新产品发布环节隆重推出5G RedCap AIoT摄像机,再次抓紧需求先机,为行业用户创造无限可能! 两大应用场景 助推RedCap走深向实 火遍全网络的RedCap应用场景可…

【JavaEE进阶】MyBatis表查询

文章目录 一. 使用MyBatis完成数据库的操作1. MyBatis程序中sql语句的即时执行和预编译1.1 即时执行(${})1.2 预编译(#{})1.3 即时执行和预编译的优缺点 2. 单表的增删改等操作2.1 增加操作2.2 修改操作2.3 删除操作2.4 like(模糊…

LeetCode538. 把二叉搜索树转换为累加树

538. 把二叉搜索树转换为累加树 文章目录 [538. 把二叉搜索树转换为累加树](https://leetcode.cn/problems/convert-bst-to-greater-tree/)一、题目二、题解方法一:递归(中序遍历与节点更新)方法二:反向中序遍历与累加更新&#x…

JavaFX 加载 fxml 文件

JavaFX 加载 fxml 文件主要有两种方式,第一种方式通过 FXMLLoader 类直接加载 fxml 文件,简单直接,但是有些控件目前还不知道该如何获取,所以只能显示,目前无法处理。第二种方式较为复杂,但是可以使用与 fx…

初阶数据结构(六)队列的介绍与实现

💓博主csdn个人主页:小小unicorn💓 ⏩专栏分类:C 🚚代码仓库:小小unicorn的学习足迹🚚 🌹🌹🌹关注我带你学习编程知识 栈 队列的介绍队列的概念:队…

GWO-LSTM交通流量预测(python代码)

使用 GWO 优化 LSTM 模型的参数,从而实现交通流量的预测方法 代码运行版本要求 1.项目文件夹 data是数据文件夹,data.py是数据归一化等数据预处理脚本 images文件夹装的是不同模型结构打印图 model文件夹 GWO-LSTM测试集效果 效果视频:GWO…

SNN论文总结

Is SNN a great work ? Is SNN a convolutional work ? ANN的量化在SNN中是怎么体现的,和threshold有关系吗,threshold可训练和这个有关吗(应该无关) 解决过发放不发放的问题。 Intuation SNN编码方式 Image to spike patter…

stm32之19.温湿度模块(待补充)

dth11.c文件① #include "dht11.h" #include "delay.h"// 1、温湿度模块初始化(PG9) void Dht11_Init(void) {// 0、GPIO外设信息结构体GPIO_InitTypeDef GPIO_InitStruct;// 1、使能硬件时钟 RCC_AHB1PeriphClockCmd(RCC_AHB1Periph_GPIOG, ENABLE);//…

Pyqt5开发实战记录

入职以来第一个开发项目: 1、如何给Qlabel加边框:右键label对象,选择“改变样式表”输入一下代码: border: 1px solid black;2、如何让垂直布局中button大小不发生变化:其实很简单,只需要设置button的最大…

【seaweedfs】2、Finding a needle in Haystack: Facebook’s photo storage 分布式对象存储论文

文章目录 一、介绍二、背景、设计理念2.1 背景2.2 NFS-based Design2.3 Discussion 三、设计和实现3.1 概览3.2 Haystack Directory3.3 Haystack Cache3.4 Haystack Store3.4.1 Photo Read3.4.2 Photo Write3.4.3 Photo Delete3.4.4 The Index File3.4.5 Filesystem 3.5 Recove…

WebGL 缓冲区对象介绍,创建并使用缓冲区,使用缓冲区对象向顶点着色器传入多个顶点数据的所有步骤

目录 使用缓冲区对象 使用缓冲区对象向顶点着色器传入多个顶点的数据,需要遵循以下五个步骤。 创建缓冲区对象(gl.createBuffer()) gl.createBuffer()的函数规范 gl.deleteBuffer &#…

C# winform加载yolov8模型测试(附例程)

第一步:在NuGet中下载Yolov8.Net 第二步:引用 using Yolov8Net; 第三步:加载模型 private IPredictor yolov8 YoloV8Predictor.Create("D:\\0MyWork\\Learn\\vs2022\\yolov_onnx\\best.onnx", mylabel); 第四步:图…

【OpenCV • c++】图像对比度调整 | 图像亮度调整

🚀 个人简介:CSDN「博客新星」TOP 10 , C/C 领域新星创作者💟 作 者:锡兰_CC ❣️📝 专 栏:【OpenCV • c】计算机视觉🌈 若有帮助,还请关注➕点赞➕收藏&#xff…

window系统中如何判断是物理机还是虚拟机及VMPROTECT无法检测云主机

为什么要判断物理机,因为授权不能对虚拟机安装后的软件进行授权。虚拟机可以复制可以克隆,无法作为一个不可复制ID来使用。 总结了如何判断物理机: 1. 用systeminfo的系统型号。(注,有资料是看处理器和bios。但是我这…

一步一步实验,讲解python中模块和包的使用

背景 为什么要提出这个问题? 在一个项目中,每一个python文件打开后,都会看到依赖了其他的一些包、模块等;概念混乱,魔改目标不清晰 为什么要修改? 如果需要将某开源包进行自定义处理,不再使…