APP常见的布局方式有哪些

APP页面布局会直接影响APP的视觉效果，好的布局方式往往会给用户带来舒适的视觉效果。但由於手机屏幕尺寸的限制，很多时候我们都无法将所有内容都在一屏内显示，因此在APP界面设计中，我们就需要进行合理的页面布局把信息更好地展示给用户。

APP常见的布局方式有哪些?

一、常见的图文布局有哪些?

◇ 上图下文

上图下文主要强调图片的重要性，再动人的文案还不如一张抓人眼球的图片更有吸引力，一个具有商业化目的的产品对首页版面效率是异常看重的，同样对图片质量的要求也是非常的高。

运用方式：

① 以「大图+文」的上下方式来布局时，一定要找到版面的平衡点，毕竟手机屏幕尺寸比较小，图片太大会影响信息传达和用户浏览的过程。

② 宫格排列式的上图下文能提升版面效率，此排列式更多地适用於电商平台，能达到提高转化和流量的作用。但由於宫格排列式缺乏信息完整度，在布局时需要考虑设备、极限值等带来的问题。

◇ 左图右文(右图左文)

无论是左图右文还是右图左文，都应该做好图和文的比例，图片的选择最好采用详情页中的图片进行展示，避免浪费更多的人力和时间重新配图，此外图片和文字内容的搭配也是非常重要的。

运用方式：

① 方形缩略图是最常用的形式，不会太窄或太宽，对右侧信息的布局会显得更加游刃有余;

② 横形图片虽然会使右侧文字显得空间压缩，但却非常适用於视频APP，这对整个页面的氛围感会更好;

③ 竖形图片会使右侧信息有更多的发挥空间，但是如果右侧信息过少，会使得页面过於单调和不完整;

④ 右图左文适合於资讯类和旅游率产品中，按照人的浏览习惯，如果文字比图片更重要，把图片放到右边会更加合适。

◇ 图文混排

为了让信息传达更一致，且没有大量文字信息干扰我们，则可选择文字与图片混排的布局方式。

运用方式：

为了适应多变的图片，文字底部加一层黑色半透明蒙层或一些无伤大雅的阴影。

二、常见的按钮布局有哪些?

按钮使用的场景主要有：主线场景、支线场景以及异常场景，不同的场景使用的按钮布局也会有所不同：

◆ 主线场景

一般主线场景的按钮都是放在页面底部固定显示，不会随着内容滚动，主线场景按钮主要分为两种：通栏和非通栏按钮。

通栏按钮：适合可滚动的页面容器，简单来说就是内容较多在一个屏幕中无发显示全部内容，按钮的优先级会更高;

非通栏按钮：这需要考虑页面内容，如果页面内容很长就需要在按钮底部加上白色背景，尽量不要让内容穿过按钮，与通栏按钮相比，非通栏置底按钮的优先层级并没有那麽高。

◆ 支线场景

支线场景按钮一般分为：图标、文字、图标+文字、框+图文字+图标等。支线按钮的使用场景较为复杂，一般需要通过参考上下文的情景来做不同样式的选择。但为了不打扰主线流程，尽量不要将支线流程的按钮做得太过明显。

◆ 异常场景

异常场景下的按钮不需要做得特别醒目，一般采用幽灵按钮或和背景相似的颜色，这种按钮大多数是希望用户点击将页面恢复状态，并没有很强烈的引导。

好的页面设计离不开页面布局，而页面布局的好坏会直接影响页面的美观。以上是Inspirr Creation提供的APP常见页面布局方式，而这只是其中的一些布局方式，如果你有更多更好的布局方式，欢迎与我们分享!