首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

智能设计之NDN:基于约束的布局生成

该论文也是GNN(图神经网络)在视觉的探索,作者提出基于用户指定约束条件的布局生成方法:神经设计网络(NDN)。NDN由三个模块组成: ? 上图是关键的技术架构。...使用方向图(directional graph)作为表示组件(上图的Design Components)及约束条件(上图Specified Constraints)的特征。...- 模块 bounding box prediction 预测布局,预测表示为矩形的组件(bounding boxes)组成的布局图 - 模块 refinement 微调布局,此步可以加入一些美学规则。...最后,定量和定性实验表明,生成的布局在视觉上与实际设计布局相似。 ? 上图可见:添加约束与无约束的差别 ?...自动布局的效果 另外,补充下作者所使用的数据: - Magazine数据集 4千张设计图,有6类的组件 (texts, images, headlines, over-image texts, over-image

1.3K30

【Android 屏幕适配】屏幕适配通用解决方案 ⑥ ( 约束布局 ConstraintLayout 百分比布局方案 | 将设计稿尺寸自动转为约束布局百分比标签属性 | 将输出结果设置到组件标签中 )

文章目录 一、将设计稿尺寸自动转为约束布局百分比标签属性 二、将输出结果设置到组件标签中 参考文档 : 设备兼容性概览 屏幕兼容性概览 支持不同的像素密度 声明受限屏幕支持 约束布局 bias 计算公式参考...【约束布局】ConstraintLayout 偏移 ( Bias ) 计算方式详解 ( 缝隙比例 | 计算公式 | 图解 | 测量图 + 公式 ) 方案 ; 约束布局 百分比 屏幕适配案例参考 【约束布局...】ConstraintLayout 屏幕适配案例 ( 使用代码生成约束布局控件属性 ) 博客 ; 一、将设计稿尺寸自动转为约束布局百分比标签属性 ---- 美工给出的设计稿尺寸 720 \times...: 屏幕 宽高 , 其比例肯定是相对于父控件进行计算 float width = 1280, height = 720; width_inner 和 height_inner 是用于计算组件在约束布局中的位置的...数组存放的是组件 左上角顶点位置 , float[][] width_height_data 数组存放的是宽高位置 ; 有了上述 4 组数据之后 , 就可以自动生成约束布局百分比标签属性 ; 使用如下代码生成

1.6K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    【热点盘点】iOS 8增强的自动布局功能

    自动布局是iOS6开始引进的新功能,而iOS 8则在原有自动布局的基础上增加了SizeClass的概念,从而增强了自动布局功能。 自动布局的总体思路归纳起来就是四个字:相对布局。...…通过这种相对关系的管理,iOSApp就可以在运行时自动计算各UI控件的大小和位置。...对于初学者而言,使用自动布局常犯的两类错误是约束不足(约束太少)和约束冲突(约束太多),如果界面设计者给出的约束只能确定某个UI控件的大小(或大小的某一项)或位置(或位置中的某一项),此时就会出现约束不足的情况...如果为自动布局添加的约束出现约束不足,则可通过Editor菜单的Resolve Auto Layout Issues子菜单的Add Missing Constrainter菜单项进行修复;但如果为自动布局添加的约束出现约束冲突时...对于初始使用自动布局的开发者来说,难点就是理顺界面上各UI控件之间的相对关系:各UI控件的相对大小、相对位置,一旦理顺了这些关系,接下来按上面介绍的方式添加约束即可。

    1.2K10

    iOS中Cell约束--使用xib实现多label的自动约束--高度随内容自适应

    made in 小蠢驴的配图        说起iOS开发,很多人的印象就是-弄一个tableView,把数据全丢到上面展示,听起来好像很粗糙,不过仔细一想,确实展示数据内容的,用的tableView是最多的了吧...添加右侧约束 约束报错 如图,添加完右侧约束之后,我们发现约束报错了,原因:两个label都没设置宽度,都是根据内容自动设定的,这样就会导致均无法确定两个的frame,所有约束报错 ---- -->小...,内容确实会自动换行了,也都有显示了,也证明了我们设置宽度约束的思路是没错的 但是!...所以暂定,左侧设置宽度约束,然后再根据实际内容,修改左侧的宽度,而右侧的宽度 = 屏幕宽 - 左侧宽度!...根据keyLabel的内容计算宽度 通过内容,计算keyLabel的宽度,同时设置到keyLabel的宽度约束上,更新约束; 随后,valueView由于自适应,其宽度就自动 = 屏幕宽度 - keyLabel

    3.6K60

    基于XCTest的iOS自动化测试

    ,生怕一不留神被拉去祭天~~为了能随时应对各种项目中紧急突发状况,提高测试效率,小编通过了解,希望能够通过自动化测试方法,提高回归测试效率,保证产品核心功能的上线质量。...对iOS系统的APP测试而言,Xcode集成的XCTest是再好不过的测试框架了,下面小编来分享一些基于XCTest的自动化测试的认识,希望能对做iOS自动化测试的各位同学有所帮助。...UI Test一般会考虑到用户的交互流程,模拟用户的交互操作,利用XCTest的UI记录特性来获取界面上的一些列视图元素和操作事件,然后在测试方法中触发事件。...那么基于XCTest的自动化测试是怎么执行的呢? 1....接下来就是针对测试结果进行对应的处理了~ 结束语 本文小编主要分享了XCTest框架的自动化测试是什么,怎么执行,测试结果代码覆盖率等内容,除此之外,XCTest还可以在服务端进行持续集成自动运行测试

    3.8K21

    分子动力学模拟之基于自动微分的LINCS约束

    这时就需要在一次不加约束的更新迭代之后(如Velocity-Verlet算法等),再施加一次约束算法,重新调整更新的坐标,使得规定的键长不会产生较大幅度的变更。...需要额外提醒的是,第一张图中的成键实际上是三维的成键,所以视觉上的大小差异不是真是的键长大小差异,具体差异数值还是以第二张图中展示的为准。...,K 其中K的大小在这里代表了成键的对数,简单理解就是保证每一对更新后的键的键长的大小与正常的键长大小保持一致,比方说固定了一个OH基中O和H的相对距离。...的形式给定,就可以在Jax中非常方便的计算其导数,并且有别于数值微分,自动微分兼具了高性能与高精度。...注意事项一 是基于 来进行调整的,但是如果一开始直接使用: r=r_unc 来初始化的话,会导致r_unc被覆盖,要知道r_unc还是会被频繁调用的,所以我们初始化的时候最好加上一个copy的操作

    72420

    iOS屏幕适配概述1 屏幕适配简介2 Autoresizing3 Auto Layout

    [toc] 1 屏幕适配简介 1.1 屏幕发展历史 手机型号 |屏幕大小 | 分辨率 ------------ | ------------- 4, 4S |3.5 | 320480 5,5C,5S...iOS 6 —— Auto Layout(自动布局) 随着 iPhone5 \ iPhone5s 等的发布苹果设备不同尺寸的屏幕变得越来越多, 不仅要求能根据控件父子 关系来设置相对位置,也要求能根据任意控件之间的关系来设置位置因为...—— Size Classes + Auto Layout 使用 Size Classes + Auto Layout 进行屏幕适配 当 iPhone6 发布以后,苹果设备的屏幕越来越多(以后也可能出现更多不同大小的屏幕...),为了能更容易的适配不同 的屏幕,苹果推出了 Size Classes 技术 通过 Auto Layout 设置的约束,约束一旦添加就会应用于各种屏幕(也就是说在 各种不同的屏幕下都使用相同的约束)...约束,程序员可以 通过选项配置subview的大小、排布以及彼此间的间距 使用 stackview 主要简化在线性方向上,重复设置控件布局约束的问题 2 Autoresizing 只是为了介绍, 以后不要用

    1.3K30

    iOS快速入门

    (2) 常用的第三方库 Masonry Masonry是一个轻量级的布局框架 拥有自己的描述语法 采用更优雅的链式语法封装自动布局 简洁明了 并具有高可读性 而且同时支持 iOS 和 Max OS X...ScrollView的contentSize的大小是由其subview的constraints来决定的。...Round 3 - 一个坑 The Mystery of the +requiresConstraintBasedLayout 基于约束的布局是懒触发的,只有在添加了约束的情况下,系统才会自动调用 -updateConstraints...方法,如果把所有的约束放在 updateConstraints中,那么系统将会不知道你的布局方式是基于约束的,所以重写+requiresConstraintBasedLayout 返回YES就是明确告诉系统...:虽然我之前没有添加约束,但我确实是基于约束的布局!

    62520

    iOS开发-屏幕适配三种技术(Autoresizing,AutoLayout,SizeClass)

    开发中:要进行适配 什么是适配: 适应、兼容不同的情况 常见的适配: 1.系统适配:针对不同版本的操作系统进行适配 2.屏幕适配:针对不同大小的屏幕尺寸进行适配 iOS屏幕适配: iPhone尺寸:...Paste_Image.png 1、横竖屏幕相对简单 2、让子控件跟随父控件的尺寸发生相应的变化 3*、处理父子关系---在storyboard中实现的,无法实现兄弟控件的布局 ?...Paste_Image.png 2、AutoLayout(自动布局) 用来布局UI界面的 iOS6.0(xcode4.0)就出现了(iPhone5) iOS7.0(xcode5.0)流行Autolayout...只需要设置lable的宽度和距离父控件的左边,顶部,就可以自动包裹内容。...Paste_Image.png 结论:根据UILable的内容大小,去调整控件的大小 1、设置父控件的约束 内部错误:注:(2.距离控制器View的左边) ?

    5.5K10

    【IOS开发基础系列】Autolayout自动布局专题

    很明显一个是自己为原点的坐标系,一个是以屏幕为原点的坐标系。         当谈到自动布局,橙色代表坏的。InterfaceBuilder绘制两个橙色方块:一个是虚线边框,一个是实线边框。...虚线方块是根据自动布局显示视图的frame。实线方块是根据你在屏幕上放置的视图的frame。这两个应该吻合的,但是这里并没有。 Note:你可能会奇怪,为什么Xcode不为X轴方向自动增加一个约束。...Xcode将不再增加任何自动约束,并希望你为这个视图增加需要的约束。...NS_AVAILABLE_IOS(6_0);         在使用自动布局之前要对子视图的布局方式进行调整,用到这个UIView的属性。...旋转屏幕的情况下也会自动处理布局。这样看起来代码多,但是可以适应多种分辨率的屏幕。不排除以后苹果出更大更多分辨率的手机。

    34940

    端开发技术——解密Flutter响应式布局

    在使用Flutter构建响应式布局之前,我想说明一下Android和iOS是如何处理不同屏幕大小的布局的。 1....在Android中,你可以为不同的屏幕大小定义不同的布局文件,Android框架会根据设备的屏幕大小自动处理这些布局之间的切换。...2. iOS的方法 iOS用于定义响应式布局的方式如下 2.1 Auto Layout Auto Layout可用于构建自适应界面,您可以在其中定义用于控制应用程序内容的规则(称为约束)。...当检测到某些环境变化(称为特征)时,“Auto Layout”会根据指定的约束条件自动重新调整布局。 2.2 Size classes Size类的特点是会根据其大小自动分配给内容区域。...响应式布局:在不同大小的屏幕上使用不同的布局。 我们将建立一个名叫Flow的聊天应用程序。

    2.3K00

    如何在flutter中构建响应式布局(第五节)

    在继续在 Flutter 中构建响应式布局之前,我想说明一下 Android和iOS如何处理不同屏幕尺寸的原生布局。...这也适用于像智能手表这样的设备,它们的屏幕空间很小,调整组件大小以适应屏幕大小可能会导致奇怪的 UI。 2. 替代布局 为了解决上述问题,您可以为不同尺寸的设备使用替代布局。...VectorDrawable用于任何类型的插图,例如图标。 iOS方法 iOS 用于定义响应式布局的概念如下: 1. 自动布局 ?...自动布局可用于构建自适应界面,您可以在其中定义管理应用程序内容的规则(称为约束)。当检测到某些环境变化(称为特征)时,自动布局会根据指定的约束自动重新调整布局。 2....尺码等级 大小类是根据大小自动分配给内容区域的特征。iOS 根据内容区域的大小类别动态调整布局。在 iPad 上,当你的 app 在?多任务配置中运行时,size classes 也适用。

    2.9K10

    深入详解iOS适配技术

    最近,iPhone家族又诞生一款iPhoneSE,鉴于这款iPhoneSE的屏幕尺寸和iPhone5S的尺寸一模一样——同样是4.0英寸,广大iOS开发者可算是松了口气,不然iOS的屏幕尺寸真的是越来越让人眼花缭乱...按照时间顺序,屏幕适配是这样发展的:纯代码计算frame-> autoresizing(早期进行UI布局的技术,仅适用于约束父子控件之间的关系)->AutoLayout(iOS6/2012年、iPhone5...(其实也不是不可取,很多iOS开发者做屏幕适配的时候不是用的autoresizing或autolayout,而是以代码的方式动态获取屏幕的尺寸,然后根据屏幕的尺寸来写死子控件的frame。...autoresizing.png (一)Autoresizing Autoresizing是早期iOS设备机型很少、APP界面布局相对简单的背景下产生的一种屏幕适配技术。...用苹果官方的话,Auto Layout是一个基于约束的,描述性的布局系统。所谓基于约束就是代表我们可以为需要布局的子控件添加一些约束对象来限制他在屏幕上显示的位置。

    8.5K70

    IOS开发之尺寸

    “屏幕”上的各种信息,包括文字、图片、表格等等,都会随屏幕的分辨率变化而变化,一个100px宽度大小的图片,在800×600分辨率下,要占屏幕宽度的1/8,但在1024×768下,则只占约1/10。...同时该API根据UIScreen的scale,自动查找包含对应高倍图后缀名(@2x)的文件,如果找到二倍图,则image.scale=2.0,对应逻辑size大小以point度量(pixel度量的一半)...10.UI相对布局 考虑到iPhone机型的多样性,不可能针对iPhone4(s)、5(s)、6、6+四种屏幕尺寸出四套视觉交互稿,也不要基于某一机型从上往下、从左往右给绝对标注,而应该关注subView...开发人员基于与屏幕边缘的间距(Margin/EdgeInsets),定位边缘处的控件(钉钉子)作为参照,然后基于控件尺寸和间隙进行相对计算排版。...苹果在WWDC2012 iOS6中已提出了Auto Layout的概念,即使用约束条件来定义视图的位置和尺寸,以适应不同尺寸和分辨率的屏幕。

    3K40

    基于HTML5的3D网络拓扑自动布局

    上篇将HT for Web的3D拓扑弹力布局的算法运行在Web Workers后台(http://www.hightopo.com/blog/70.html),这篇我们将进一步折腾,将算法运行到真正的后台...Node.js自然没那么简单了,我采用了Socket.io通信框架,Socket.io让长连接通信变得无比简单,和Web Workers的通信几乎一样的容易了,Socket.io的用法下图一目了然: ?...', result);发送自动布局算法的运算结果push到客户端。...发送客户端拖拽信息,以及socket.on监听服务器推送过来的自动布局结果: g3d.mi(function(evt){ if(evt.kind...,我打开了两个页面,这样就会有两个socket分别连接后台Node.js,而Node.js默认是单线程的,如果正在一个请求函数密集运算处理,则其他请求只能排队等待处理,这也是视频中我拖拽一个页面布局是,

    1.4K70

    iOS的一种基于服务器下发的动态布局方案(一)

    栅格布局简介 栅格布局MyGridLayout是MyLayout布局体系里面的第八种布局。这是一种将布局约束设置和视图分离的布局方式,就像HTML中的标签元素和css样式可以进行分离表示和存储。...因此栅格布局非常适合于数据内容相同但是展示样式不同的场景,展示样式可以动态配置和变化,甚至于可以从服务器进行动态下发。栅格布局还提供了一种基于JSON语法进行布局格式描述的机制来实现界面布局。...用户点击这些矩形区块时往往逻辑都是比较统一的进行处理。 这些需求基本都可以通过栅格布局来实现,而且栅格布局也是一种专门解决这类问题的布局体系!...在栅格布局中所有视图不需要进行任何布局排列相关的约束设置,视图只负责内容、颜色、字体等相关属性的设置,而栅格则负责位置和尺寸对齐以及边界线相关的属性的设置。...因为我们对栅格布局的定位是可以基于服务器下发的动态布局解决方案。

    1.4K30

    iPhone屏幕尺寸、分辨率及适配

    同时该API根据UIScreen的scale,自动查找包含对应高倍图后缀名(@2x)的文件,如果找到二倍图,则image.scale=2.0,对应逻辑size大小以point度量(pixel度量的一半)...11.UI相对布局 考虑到iPhone机型的多样性,不可能针对iPhone4(s)、5(s)、6、6+四种屏幕尺寸出四套视觉交互稿,也不要基于某一机型从上往下、从左往右给绝对标注,而应该关注subView...开发人员基于与屏幕边缘的间距(Margin/EdgeInsets),定位边缘处的控件(钉钉子)作为参照,然后基于控件尺寸和间隙进行相对计算排版。...苹果在WWDC2012 iOS6中已提出了Auto Layout的概念,即使用约束条件来定义视图的位置和尺寸,以适应不同尺寸和分辨率的屏幕。...设备的屏幕尺寸、分辨率及其屏幕边长比例》 《iOS判断设备屏幕尺寸、分辨率》 《iOS8中的UIScreen》 《Detecting iPhone 6/6+ screen sizes in point

    6.1K20

    最新iOS设计规范七|10大视觉规范(Visual Design)

    在iOS应用中,您可以配置界面元素和布局,以在iPad上执行多任务处理时,在拆分视图中,在屏幕旋转时以及在其他设备上自动更改形状和大小。设计一个适应性强的界面在任何环境下都提供出色的体验非常重要。...自动布局 自动布局(Auto Layout)是一种构建自适应接口的开发工具。使用“自动布局”,你就可以定义控制APP中内容的规则(称为约束)。...例如:无论可用的屏幕空间多大,你都可以约束一个按钮,使其始终水平居中并定位在距离图像下方8pt的位置。 当检测到某些环境变化(称为特征)时,自动布局会根据指定的约束自动调整布局。...你可以将APP设置为动态适应各种特征,包括: 不同的设备屏幕尺寸,分辨率和色域(sRGB / P3) 不同的设备方向(纵向/横向) 拆分视图 iPad上的多任务处理模式 动态类型文本大小更改 基于区域设置启用的国际化功能...尺寸类型 尺寸类型是根据大小自动分配给内容区域的特征。系统定义了两个尺寸类型,常规/Regular(表示扩展空间)和紧凑/ Compact(表示约束空间),它们用来描述视图的高度和宽度。

    8.1K30

    iOS开源界面布局库终于破3000star

    后来在iOS6.0以后,苹果公司推出了一种新的界面布局方案AutoLayout,这种方法主旨是通过相对的约束设置进行布局来减少代码中硬编码的编写,从而达到多设备适配以及简化布局的能力。...因此线性布局比较适合通过代码的方式来 构造视图。同时适合于将线性布局作为scrollview的子视图来布局。因为线性布局在位置调整后会 如果是使用自动布局则这个类将无效。...但实际中我们总是带着解决问题的想法去使用某个框架和库的,我这里想说的是当你在使用AutoLayout时因为复杂的约束设置以及更新方法而焦头烂额时,当你使用AutoLayout而对多屏幕多设备适配而进行多条件编写时...而且我本人还会一直热心的为你解答任何在使用过程中的问题。 既然使用一个库那么总是应该有优缺点的,首先布局库的优点是: 性能高,因为内部实现是基于frame的所以性能是AutoLayout的5倍左右。...多屏幕和多设备适配能力强,布局库能非常方便和简单的实现多设备种类的适配,比如提供一些比例设置、浮动间距、浮动尺寸、以及对SizeClass的支持等等,你不再需要编写很多条件语句来实现不同设备下的布局处理

    1.9K40
    领券