排版

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 基于Spanned排版引擎初探 前言 ****的个人中心的界面基本上都要求需要服务端可配置,实现灵活排版.但对于客户端来说,这种方式实现起来不确定因素带多了,仅用单纯的某一控件是很难实现的.其一解决方法是这些页面都用WebView控件排版,这样服务端只要填充web页面就可以了,但是WebView是重量级的,而且会伴有不确定的WebKitCore的内存泄漏,再则由于Web页面数据大小,服务器,网络等因素页面加载有可能出现缓慢的现象.故这里提出一种基于android TextView控件的Spanned的排版和数据解析的实现方式.可以实现url点击,图文混排,颜色,背景等独立排版.如此服务端就可单独下发标签化数据,此外客户端又可根据不同类型数据,实现不同的数据请求策略. 利用上述的方法就可在个人中心的部分页面以及私信内容实现服务端可控图文混排. 一、格式化标签 要想达到前言中的效果,就要规定一组可识别的格式化标签规范,该标签语法如下: 1. 一级标签: $span:<tag>[(arg0,arg1,…)]; . ’$span’为格式化标签开始, . ’;’为格式化标签结尾; . ’<tag>’标签主体,必有部分,例如图片:’img’,链接:’url’; . [(arg0,arg1,…)]是后随参数部分.例如:图片:

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 3. 对齐 在网页设计中，页面上的元素不能随意摆放，每一项都要与页面内容存在某种联系。对齐也是网页设计必不可缺少的一部分，它可以帮助设计师做出非常吸引眼球的设计，这也是是优秀网页设计的潜在要求。 对齐的案例非常多，我们随便列举两个。 下图的网站中产品左对齐： 另一个网站的居中对齐： 第一幅图的左对齐和右对齐让文本看起来更清晰、效果分明；第二幅图的居中对齐则显得更庄重、正式、稳重。 4. 亲密性 亲密性是指把一些相关的东西组织在一起让它们从整体看起来和谐统一。 我们可以从两点入手：适当的留白、用视觉的重点突出层次感。 比如下图中的图文搭配，是多个元素组合在一起的排版。 用户的眼睛首先被Banner的图和文字吸引，然后再向下移动到文字的描述以及链接文字，这些元素的亲密性和对比形成一种平衡。 来源： oschina 链接： https://my.oschina.net/u/2971691/blog/786018

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 四项基本设计原理，对比、重复、对齐、亲密性被设计师广泛应用。它们在网页设计中对文字的 排版 也经常用到。 1. 对比 我们将对比分为三类，有标题和正文中的字体、字号对比，文字颜色的对比，以及文字颜色与背景颜色的对比。 标题与正文的对比 在下面网站案例页面中，标题使用18px的微软雅黑，正文使用12px的宋体，两种字体和字号的对比让文字内容富有层次，能吸引读者眼球。 文字颜色对比 在下图中，有一部分文字采用了与正文文字不同的另一种颜色，这种对比是增加视觉效果的有效途径之一，突出展示该段落的重点。 文字颜色与背景颜色的对比 这是一种常用的排版方式，正文与背景合适的颜色对比，不仅可以提高文字的清晰度，并且可以产生强烈的视觉效果。 比如在下图中，白色的背景、红色的标题、黑色的正文这三者之间的对比，还有黑色背景与白色文字对比的应用，将文字内容清晰衬托出来，既有丰富的层次感，同时具有很强的突出效果与视觉冲击力。 不过设计师在使用对比时需要注意，要确保文字是清晰的，如果文字太小或比较纤细或色彩的对比度不够的话，这样会适得其反，举个例子： 如果对色彩的对比度还不够熟练的设计师，可以通过颜色对比检测工具（如Check My Colours、Colour Contrast Check）检测色差和亮度差，确保网页的易读性。 来源：

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 2. 重复 设计中的每一个元素都可以在整个网页中重复出现，那么对 文字 来说，有可能字体、字号、样式的重复，也可能是同一种类型的图案装饰、文字和图片整体的排版布局方式等。重复会给用户一种有组织和一致性的体验，可以创造出阅读的连贯性，显得你更专业。 比如下图中在产品准则部分采用了统一的“图片+标题+正文”，内容不同，但是布局方式统一，图片的风格一致。用户一眼看过去，就知道这是属于同一个版块的内容，这样的重复很容易有一种连贯和平衡美感。 下图是一个流程，标题和文字在图片同样的位置、采用同样形式，与图片背景颜色形成对比，而文字样式的也重复的，这样显得一致性、统一性。 重复在网页设计上应用的非常广泛，单一的重复也许会显得单调，设计师可以根据不同网站的风格灵活使用它，比如有变化的重复能增加创意，给网页设计增加活力。 来源： oschina 链接： https://my.oschina.net/u/2971691/blog/785996

项目中页面需要用到一个展示多个网络图片的页面,图片高低不等.异步加载完成时间不同,不能将高度固定,该文章用于简单布局. 1.创建用于存放imgView的view _headerImgView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, [DMDevceManager screenWidth], 0)]; _headerImgView.backgroundColor = [UIColor whiteColor]; _headerImgView.userInteractionEnabled = YES; 2.创建一个数组用来存放图片高度(按位存放,最多十张) tmpHeightArr = [NSMutableArray arrayWithArray:@[@0,@0,@0,@0,@0,@0,@0,@0,@0,@0]]; 3.每张图片先给定400高度加上占位图告诉用户图片正在加载.(_imgViewHeight是整个大的View的高度) _imgViewHeight = 40 + (300+5) * _model.imagesArray.count; 4.使用循环创建图片的imgView.(使用tag值标记每个view,方便取出改高度) for (int i = 0 ;i < _model.imagesArray.count ; i++)