html5开发之ios屏幕适配,iOS开发屏幕尺寸以及屏幕适配等问题(转载内容)

原帖地址:http://blog.csdn.net/phunxm/article/details/42174937/

仅供我个人收藏学习,原博主如不同意请联系qq651263878进行删除,在此表示感谢以及歉意。

1.iPhone尺寸规格

cf0d1f7cdb5e

后续上市的iPhone7以及iPhone7plus  与六代相同

1 inch = 2.54cm = 25.4mm

上表中的宽高(width/height)为手机的物理尺寸,包括显示屏和边框。

以下为iPhone4s的宽高示意图:

cf0d1f7cdb5e

我们通常所说的iPhone5屏幕尺寸为4英寸、iPhone6屏幕尺寸为4.7英寸,指的是显示屏对角线的长度(diagonal)。

以下为iPhone5~6+的屏幕尺寸规格示意图:

cf0d1f7cdb5e

PPI(Pixel Per Inch by diagonal):表示沿着对角线,每英寸所拥有的像素(Pixel)数目。

PPI数值越高,代表显示屏能够以越高的密度显示图像,即通常所说的分辨率越高、颗粒感越弱。

cf0d1f7cdb5e

cf0d1f7cdb5e

根据勾股定理,可以得知iPhone4(s)的PPI计算公式为:

cf0d1f7cdb5e

计算结果稍有出入,这是因为像素的离散采样有锯齿效应。

早期的iPhone3GS的屏幕分辨率是320*480(PPI=163),iOS绘制图形(CGPoint/CGSize/CGRect)均以point为单位(measured in points):

1 point = 1 pixel(Point Per Inch=Pixel Per Inch=PPI)

后来在iPhone4中,同样大小(3.5 inch)的屏幕采用了Retina显示技术,横、纵向方向像素密度都被放大到2倍,像素分辨率提高到(320x2)x(480x2)= 960x640(PPI=326), 显像分辨率提升至iPhone3GS的4倍(1个Point被渲染成1个2x2的像素矩阵)。

但是对于开发者来说,ios绘制图形的API依然沿袭point(pt,注意区分印刷行业的“磅”)为单位。在同样的逻辑坐标系下(320x480):

1 point = scale*pixel(在iPhone4~6中,缩放因子scale=2;在iPhone6+中,缩放因子scale=3)。

可以理解为:

scale=绝对长度比(point/pixel)=单位长度内的数量比(pixel/point)

UIScreen.h中定义了该属性:

// The natural scale factor associated with the screen.(read-only)

@property(nonatomic,readonly)CGFloatscaleNS_AVAILABLE_IOS(4_0);

--------------------------------------------------------------------------------

This value reflects the scale factor needed to convert from the defaultlogical coordinate spaceinto thedevice coordinate spaceof this screen.

The default logical coordinate space is measured usingpoints. Forstandard-resolutiondisplays, the scale factor is 1.0 andone point equals one pixel. ForRetinadisplays, the scale factor is 2.0 andone point is represented by four pixels.

--------------------------------------------------------------------------------

为了自动适应分辨率,系统会根据设备实际分辨率,自动给UIScreen.scale赋值,该属性对开发者只读。

iOS8新增了nativeScale属性:

// Native scale factor of the physical screen

@property(nonatomic,readonly)CGFloatnativeScaleNS_AVAILABLE_IOS(8_0);

--------------------------------------------------------------------------------

(lldb)p (CGFloat)[[UIScreen mainScreen] scale]

(CGFloat) $1 = 3

(lldb) p(CGFloat)[[UIScreen mainScreen] nativeScale]

(CGFloat) $2 = 3

--------------------------------------------------------------------------------

在同样的逻辑分辨率下,可以通过scale参数识别是iPhone3GS还是iPhone4(s)。以下基于nativeScale参数,定义了探测机型是否为iPhone6+的宏:

--------------------------------------------------------------------------------

// not UIUserInterfaceIdiomPad

#defineIS_IPHONE(UI_USER_INTERFACE_IDIOM() ==UIUserInterfaceIdiomPhone)

// detect iPhone6 Plus based on its native scale

#defineIS_IPHONE_6PLUS(IS_IPHONE && [[UIScreenmainScreen] nativeScale] == 3.0f)

--------------------------------------------------------------------------------

那么,同样的分辨率和scale,如何区分机型iPhone4与4s、iPhone5与5s呢?通过[[UIDevice currentDevice] model]只能判别iPhone、iPad、iPod大类,要判断iPhone具体机型型号,则需要通过sysctlbyname("hw.machine")获取详细的设备参数信息予以甄别。

cf0d1f7cdb5e

cf0d1f7cdb5e

8.@2x/@3x以及高倍图适配

@2xmeans the same “double”retina resolution that we’veseen on all iOS devices with retina displays to date, where each virtual pointin the user interface is represented bytwophysical pixels on thedisplayin each dimension, horizontal and vertical.

iPhone3GS时代,我们为一个应用提供图标(或按钮提供贴图),只需要icon.png。针对现在的iPhone4~6 Retina显示屏,需要制作额外的@2x高分辨率版本。

例如在iPhone3GS中,scale=1,用的图标是50x50pixel(logicalimage.size=50x50point);在iPhone4~6中,scale=2,则需要100×100pixel(logical image.size=50x50point,乘以image.scale=dimensions in pixels),并且命名为icon@2x.png。

如果APP要同时兼容iPhone3GS~iPhone6,则需要提供icon.png/icon@2x.png两种分辨率的图片。

@3xmeans a new “triple” retina resolution, where eachuser interface point is represented bythreedisplay pixels. A single @2x pointis a 2 × 2 square of 4 pixels; an @3x point is a 3 × 3 square of 9 pixels.”

iPhone6+在实际渲染时,downsampling/1.15(1242x2208->1080x1920),准确的讲,应该是@2.46x。苹果为方便开发者用的是@3x的素材,然后再缩放到@2.46x上。

如果APP要同时兼容iPhone3GS~iPhone6+,则需要提供icon.png/icon@2x.png/icon@3x.png三种分辨率的图片。

需要注意的是,iOS APP图标的尺寸和命名都需要遵守相关规范。

对于iPhone3、4/5/6、6+三类机型,需要按分辨率提供相应的高倍图并且文件名添加相应后缀,否则会拉伸(stretchable/resizable)失真(模糊或边角出现锯齿)。

以下基于UIImage的两类初始化API简介高倍图的适配:

<1>+imageNamed:该方法使用系统缓存,适合表视图重复加载图像的情形。同时该API根据UIScreen的scale,自动查找包含对应高倍图后缀名(@2x)的文件,如果找到二倍图,则image.scale=2.0,对应逻辑size大小以point度量(pixel度量的一半);如果没找到设置默认image.scale=1.0,对应逻辑size大小同像素尺寸。因此,使用该方法,无需特意指定高倍图后缀。在实际运行时,系统如果发现当前设备是Retina屏(scale=2),会自动寻找"*@2x.png"命名格式的图片,加载针对Retina屏的图片素材,否则会失真。

<2>+imageWithContentsOfFile/+imageWithData:(scale:)/-initWithContentsOfFile:/-initWithData:(scale:)

这组方法创建的UIImage对象没有使用系统缓存,并且指定文件名必须包含明确的高倍图后缀。如果文件名包含@2x后缀,则image.scale=2.0;否则默认image.scale=1.0,同样对于Retina屏将会失真。

<3>目前,适配iPhone6+时,除了一些铺满全屏的大图(LogoIcon、LaunchImage)需提供三倍图,其他的小图仍可沿用原有的二倍图自适应拉伸。

// Bounds of entire screen in points(本地坐标系,起点为[0,0])

@property(nonatomic,readonly)CGRectbounds;

--------------------------------------------------------------------------------

//考虑转屏的影响,按照实际屏幕方向(UIDeviceOrientation)的宽高

#defineSCREEN_WIDTH([UIScreenmainScreen].bounds.size.width)

#defineSCREEN_HEIGHT([UIScreenmainScreen].bounds.size.height)

#defineSTATUSBAR_HEIGHT([UIApplicationsharedApplication].statusBarFrame.size.height)

//不考虑转屏的影响,只取竖屏(UIDeviceOrientationPortrait)的宽高

#defineSCREEN_WIDTHMIN([UIScreenmainScreen].bounds.size.width, [UIScreenmainScreen].bounds.size.height)

#defineSCREEN_HEIGHTMAX([UIScreenmainScreen].bounds.size.height, [UIScreenmainScreen].bounds.size.width)

#defineSTATUSBAR_HEIGHTMIN([UIApplicationsharedApplication].statusBarFrame.size.width, [UIApplicationsharedApplication].statusBarFrame.size.height)

--------------------------------------------------------------------------------

iOS8新增了nativeBounds属性,输出竖屏像素级分辨率:

// The bounding rectangle of the physical screen,measured inpixels. (read-only)

// This rectangle is based on the device in a portrait-up orientation. This value does not change as the device rotates.

@property(nonatomic,readonly)CGRectnativeBoundsNS_AVAILABLE_IOS(8_0);

以下是iPhone6+下的输出:

--------------------------------------------------------------------------------

(lldb) poNSStringFromCGRect([(UIScreen*)[UIScreen mainScreen] bounds])

{{0, 0}, {414, 736}}

(lldb) poNSStringFromCGRect([(UIScreen*)[UIScreen mainScreen] nativeBounds])

{{0, 0}, {1242, 2208}}

--------------------------------------------------------------------------------

// Frame of application screen area in points (i.e.entire screenminusstatus bar if visible)

// bounds除去系统状态栏

@property(nonatomic,readonly)CGRectapplicationFrame;

--------------------------------------------------------------------------------

// APPFRAME_WIDTH=SCREEN_WIDTH

#defineAPPFRAME_WIDTH([UIScreen mainScreen].applicationFrame.size.width)

// APPFRAME_HEIGHT=SCREEN_HEIGHT-STATUSBAR_HEIGHT

//注意:横屏(UIDeviceOrientationLandscape)时,iOS8默认隐藏状态栏,此时APPFRAME_HEIGHT=SCREEN_HEIGHT

#defineAPPFRAME_HEIGHT([UIScreen mainScreen].applicationFrame.size.height)

--------------------------------------------------------------------------------

cf0d1f7cdb5e

10.机型尺寸Screen Scale Adaption)

从iPhone3GS/iPhone4(s)过渡到iPhone5(s)时,在逻辑上宽度不变高度稍高,之前旧的素材和布局通过AutoresizingFlexible简单适配即可运行得很好,但由于高宽比增大,上下两端出现黑粗边(典型如LaunchImage)。从分辨率的角度来看,除了需要提供LaunchImage这种满屏图,其他基本沿用二倍图(@2x);从屏幕尺寸角度来看,需要对纵向排版略加调整。

从iPhone5(s)发展到iPhone6(+),由于高宽比保持不变,iOS对图标、图片、字体进行等比放大自适应,清晰度会有所降低。同时,绝对坐标布局会导致在大屏下出现偏左偏上的问题。从分辨率的角度来看,iPhone6沿用二倍图(@2x),但需为iPhone6+提供更高的三倍图(@3x);从屏幕尺寸角度来看,需要重新对UI元素尺寸和布局进行适配,以期视觉协调。

我们先来看一下iPhone4~6(+)的屏幕高宽比:

iPhone4(s):分辨率960*640,高宽比1.5

iPhone5(s):分辨率1136*640,高宽比1.775

iPhone6:分辨率1334*750,高宽比1.779

iPhone6+:分辨率1920*1080,高宽比1.778

可粗略认为iPhone5(s)、6(+)的高宽比是一致的(16:9),即可以等比例缩放。因此可以按宽度适配:

fitScreenWidth= width*(SCREEN_WIDTH/320)

这样,共有iPhone3/4/5、6、6+三组宽度,在iPhone6、6+下将按比例横向放大。

在同样的宽度下,iPhone4(s)的屏高比iPhone5(s)低,若纵向排版紧张,可以iPhone5(s)为基准,按高度适配:

fitScreenHeight= height*(SCREEN_HEIGHT/568)

共有iPhone3/4、5、6、6+四组高度,在iPhone3/4下将按比例纵向缩小,在iPhone6、6+下将按比例纵向放大。

这里需要注意iPhone/iOS双环上网的热点栏对纵向布局的影响:iPhone作为个人热点且有连接时,系统状态栏下面会多一行热点连接提示栏"Personal Hotspot: * Connection",纵向会下压20pt,[UIApplication sharedApplication].statusBarFrame高度变为40pt;当所有连接都断开时,热点栏消失,纵向高度恢复正常为20pt。详情可参考《iPhone/iOS开启个人热点的纵向适配小结》。

另外,iPhone的【设置】【通用】【辅助功能】中可以设置调节【更大字体】,APP也可以按字号适配:

例如适配表视图(UITableView:UIScrollView),无法左右滑动,因此无论字号缩放比例多大,横向都不应超过SCREEN_WIDTH。注意限定控件元素内容区域宽度以及间距,并设置适当的LineBreakMode。表视图支持上下滑动,因此纵向上的表格行高和内容区域高度可按字号缩放。

对于纵向也不支持滑动的视图,在屏幕可见视区内排版时,最好不要随字号缩放,否则可能超出既定宽高。

考虑到iPhone机型的多样性,不可能针对iPhone4(s)、5(s)、6、6+四种屏幕尺寸出四套视觉交互稿,也不要基于某一机型从上往下、从左往右给绝对标注,而应该关注subView在superView中的相对位置(EdgeInsets/Frame/Center)以及siblingView之间的偏移(Offset),尽量给出适合Autolayout的相对布局比例(理想情况是只给百分比)。假如交互按照iPhone5(s)下绝对标注,则在iPhone4(s)上可能挤出屏幕底部,而在iPhone6(+)上则可能横向偏左或纵向偏上。

开发人员基于与屏幕边缘的间距(Margin/EdgeInsets),定位边缘处的控件(钉钉子)作为参照,然后基于控件尺寸和间隙进行相对计算排版。这样,若钉子移动,相邻控件将顺向偏移,不会因为局部调整而出现凌乱。

我们截取 iPhone5s QQ 文件助手列表中的文件cell,使用SketchMeasure对其进行测量标注。

cf0d1f7cdb5e

打开[截图.png]文件,由于不包含 Sketch 图元对象,无法进行 measure 标注(提示:请在画板中使用该功能)。因此,第一步需要对要相对标注的各个UI元素进行对象化。依次Insert Artboard 创建图层 frame、thumbnail、title、detail、source、button。

选中整个cell的frame(bounds),进行 Measure size:width=640px(SCREEN_WIDTH),height=168px。默认横向尺寸和纵向参考线都居中导致标注重叠,将纵向参考线右移至合适位置;也可选中WIDTH标注图层中的text和label元素,在不移动参考线的前提下,利用鼠标局部移动标注字面量。

(1)缩略图标

在左侧边栏layer list中选中frame,再command选中文件类型缩略图对象thumbnail,进行 Measure spacing,丈量缩略图左侧相对frame的间距为24px。

选中文件类型缩略图对象thumbnail,进行 measure size,由于正方形等宽为112px*112px,故横纵标注重叠无影响。thumbnail在frame中纵向整体居中,因此上下边距计算均摊即可,无需再给定标注。

(2)传输按钮

对 button 和 frame 进行 Measure spacing,丈量按钮右侧相对frame的间距为24px。

选中按钮button进行 measure size,其宽高为144px*60px。横纵标注重叠影响视觉,将纵向参考线右移至合适位置。

button在frame中纵向整体居中,因此上下边距计算均摊即可,无需再给定标注。

(3)文件信息

对thumbnail和detail(title、source等宽且左对齐)进行 Measure spacing,丈量图标右侧相对detail的间距为20px;对button和detail进行 Measure spacing,丈量按钮左侧相对detail间距为20px。这样,左侧钉住thumbnail,右侧钉住button,中间信息部分的宽度无需给定,计算被动约束的横向余量即可。具体编程时,调用sizeWithFont/boundingRectWithSize 可动态计算每行 label 的自然宽度,一般title都会超过约束宽度,因此需设置 lineBreakMode指定Wrapping省略或Truncating截断格式。

选中文件信息第1行标题title和第2行详情detail,进行 Measure spacing,测量纵向相对间距10px;第2行详情detail和第3行来源的纵向相对间距也为10px。一般 UILabel 的文本在给定字体下的纵向自然显示无约束,调用sizeWithFont/boundingRectWithSize 可动态计算每行 label 的自然高度,title的上间距和source的底间距无需给定,通过计算纵向余量均摊即可。

可简单的基于屏宽横纵比例进行scale缩放,将以上测量出的标注应用到iPhone6(+)大屏下,当然交互设计工程师最好还是针对特定机型都给定适配标注。苹果在WWDC2012 iOS6中已提出了Auto Layout的概念,即使用约束条件来定义视图的位置和尺寸,以适应不同尺寸和分辨率的屏幕。

最后,除了对屏幕尺寸和分辨率进行适配之外,还需对iOS SDK中相关的DEPRECATED API进行适配。典型的如:

(1)UILineBreakMode->NSLineBreakMode

(2)UITextAlignment->NSTextAlignment

(3)sizeWithFont:->boundingRectWithSize:

(4)stretchableImageWithLeftCapWidth:topCapHeight:->resizableImageWithCapInsets:

(5)...

参考:

《iOS界面适配(一)(二)(三)》

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

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

相关文章

flink checkpoint 恢复_Flink解析 | Apache Flink结合Kafka构建端到端的ExactlyOnce处理

周凯波(宝牛)阿里巴巴技术专家&#xff0c;四川大学硕士&#xff0c;2010年毕业后加入阿里搜索事业部&#xff0c;从事搜索离线平台的研发工作&#xff0c;参与将搜索后台数据处理架构从MapReduce到Flink的重构。目前在阿里计算平台事业部&#xff0c;专注于基于Flink的一站式计…

Java通过ftl模板导出word最详细教程

首先用office建一个word文档 参数写自己查询出来的字段&#xff0c;我在这里房里图片是方便找到位置替换为64位编码 模板创建好之后&#xff0c;另存为Word 2003 XML文档(*.xml) 存储为别的可能会报错&#xff0c;我只用这一种 存储为xml之后千万不要用word打开&#xff0c;最…

封装html ui 控件,聊聊前端 UI 组件:组件设计

本文首发于欧雷流。由于我会时不时对文章进行补充、修正和润色&#xff0c;为了保证所看到的是最新版本&#xff0c;请阅读原文。在本系列文章《聊聊前端 UI 组件&#xff1a;组件体系》中初步说明了 UI 组件的架构设计&#xff0c;本文将在此基础上进一步展开说说那篇文章中一…

live555推流rtsp_Hi3518 RTSP推流

1、openssl编译下载地址:http://distfiles.macports.org/openssl/解压后进入源码根路径执行./config no-asm no-async --prefix/home/chenyc/project/hi3518e/Hi3518E_SDK_V1.0.3.0/armlib/openssl --cross-compile-prefixarm-hisiv300-linux-#打开生成的makefile 删除-m64 在…

怎么两边同时取ln_男生“两边铲光”发型out了?试试这4款吧,剪完清爽又帅气...

发型对于男生来说是特别重要的&#xff01;女生可以通过化妆来让自己变得更完美&#xff0c;而男生想要改变自己的形象&#xff0c;是不敢轻易化妆的&#xff0c;只有通过改变自己的发型&#xff0c;才能更好地展现自己的魅力。现下男生最流行的发型&#xff0c;莫过于“两边铲…

ionic 修改组件默认样式_开源Magpie:组件库详解

开源项目专题系列(八)1.开源项目名称&#xff1a;magpie_fly2.github地址&#xff1a;https://github.com/wuba/magpie_fly3.简介&#xff1a;magpie_fly 是58集体出品组件库&#xff0c;统一管理日常开发中的基础组件及高阶组件&#xff0c;并提供了相对友好的方式介绍组件的具…

口袋之旅html5超强账号,口袋之旅特攻排行榜 强大的绝对能力

历史上是在金银版分了精灵的特攻物攻&#xff0c;在宝石版分了技能的特攻物攻&#xff0c;让很多精灵和技能得以重生。口袋之旅采用的是第二世代的精灵加第三世代的技能分类&#xff0c;于是特攻手也成为了一个需要挑选的部分&#xff0c;本文继续为你缩小挑选范围。特攻种族值…

使用ftl生成word

背景&#xff1a;根据word模板下载word。word里面需要填充数据&#xff0c;格式是固定的。首先在word中给数据起个变量名称 需要更换的数据改成${变量名!}&#xff0c;必须是英文的&#xff0c;加感叹号是为了防止null&#xff0c;如果数据是null&#xff0c;文档下载下来后会直…

什么叫做项目孵化_蓝莓孵化营12进5争夺战,项目人绽放自我不留遗憾

国内首档互联网职业竞技励志节目《蓝莓孵化营》&#xff0c;今晚22点在浙江卫视播出第十一期。本期节目中&#xff0c;第三事业群的12组项目人将为最终的5张终极考核入场券展开争夺。这一次&#xff0c;他们比拼的是以“2020”为主题的短视频&#xff0c;每一组项目人都拼尽了自…

七台河计算机网络工程专业,网络工程本科专业介绍

网络工程本科专业介绍网络工程专业是教育部第二类特色专业&#xff0c;比较热门&#xff0c;竞争力较大&#xff0c;考生报考此专业的时候要慎重。网络工程本科就业前景本专业的就业前景不错&#xff0c;学生可从事各级各类企事业单位的企业办公自动化处理、计算机安装与维护、…

Java实体类不要使用基本类型_为何封装javabean时,成员变量一律都不用基本类型

Java实体类不要使用基本类型 记录一下&#xff0c;在项目中因为基本类型&#xff0c;所产生的bug 包装类&#xff1a;8种基本类型的包装类 应用场景&#xff1a;数据库建立实体映射多用包装类 这两句话是重点&#xff1a;就是建立实体类禁止使用基本数据量类型&#xff01;…

一开机就提示脱机工作_「华为手机维修自学教程」华为手机的开机触发电路 华为维修技巧...

谈谈华为的开机触发电路华为这段时间的新闻不少&#xff0c;大家应该都有说了解。华为的强大意味着华为手机的维修市场越来越大。从事维修的朋友们你们准备好了吗&#xff1f;今天给大家说一说&#xff0c;华为手机的开机触发电路。修苹果手机的朋友大家都知道&#xff0c;电源…

html怎么保存曲奇,自制曲奇饼能保存多久 这些存放方法你懂吗

来源:站酷作者:Wandzilak虽然市场上的饼干种类很多&#xff0c;而且吃起来也感觉十分香&#xff0c;但是这些食品一般添加了比较多的防腐剂膨松剂&#xff0c;多吃度身体健康不是很好。因此很多人都喜欢自己在家里制作饼干&#xff0c;其中曲奇饼干就是很多人都喜欢制作的饼干之…

SpringBoot 整合mybatis-plus 高级功能及用法详解

springboot 整合mybatis-plus 高级功能及用法详解 学习并使用mybatis-plus的一些高级功能的用法例如&#xff1a; AR模式、 乐观锁 、逻辑删除 、自动填充、数据保护等功能 为了方便演示&#xff0c;咱们还是新建一个全新的项目 引入mp依赖 <dependency><groupId>…

8除以2表示什么意思_八字中劫财,比肩分别表示什么意思

◆◆比劫与其他十神的生克关系◆◆食伤&#xff1a;比劫生食伤财星&#xff1a;比劫克财星官星&#xff1a;官星克比劫印星&#xff1a;印星生比劫◆◆比劫帮身◆◆八字术语&#xff0c;比肩劫财均可助日干之力&#xff0c;如甲见甲(比)、乙(劫)、寅(禄)、卯(刃)之类&#xff0…

江苏省计算机一级考试基础知识,江苏省计算机一级考试大纲及复习指南

江苏省计算机一级考试大纲及复习指南江苏省计算机等级考试大纲(一级)计算机信息技术考试要求(试用)及使用说明1&#xff0e;掌握计算机信息处理与应用的基础知识。2&#xff0e;能比较熟练地使用六个常用的软件(IE、Outlook Express,Word,Excel,PowerPoint,和FrontPage)3掌握Ac…

MyBatis-plus 自动填充MetaObjectHandler不生效问题

背景 在项目中经常遇到一些数据需要自动填充&#xff0c;填充方法都是同一种规则&#xff0c;例如创建时间等。 1 自动填充方法配置 1.1 实体类添加注解 1.2 在handler包下实现元对象处理器接口 import com.baomidou.mybatisplus.core.handlers.MetaObjectHandler; import o…

html拖拽模态框,可拖拽的谷歌样式纯javascript模态窗口插件

draggable-google-modal是一款可拖拽的谷歌样式纯javascript模态窗口插件。该模态窗口插件使用纯js编写&#xff0c;模态窗口可以任意进行拖动&#xff0c;并且模态窗口可以全屏放大&#xff0c;或左右对齐占据半边屏幕。使用方法使用该模态窗口插件需要引入draggabilly.pkgd.j…

centos7修改网卡顺序_CentOS7网卡名称的修改

生产环境中&#xff0c;托管于机房的服务器经常会进行割接操作&#xff0c;为了能让网卡更容易让运维人员和机房识别&#xff0c;避免因为弄错网线或找错网卡导致业务中断&#xff0c;在服务器上架前就应该对所有网卡按照 eth0、eth1 的方式来命名&#xff0c;并按照网卡的物理…

new Gson().toJson日期转特定格式日期实体

Google的Gson功能非常强大&#xff01; 格式化日期我们只需要这样创建就好了 Student stu new Student();stu.setName("张三");stu.setBirthDay(new Date());如果张三的生日是日期型的话&#xff0c;直接实体转json的话&#xff0c; new Gson().toJson(stu);日期…