2.3、Android Studio使用Layout Editor设计UI

简介: Android Studio提供了一个高级的布局编辑器,允许你拖拽控件,在编辑XML之后可以实时预览。

Android Studio提供了一个高级的布局编辑器,允许你拖拽控件,在编辑XML之后可以实时预览。
在布局编辑器中,你在文字视图和设计视图直接来回切换。

在文字视图中编辑

你可以在文字视图中编辑你的布局文件,这一节描述文字视图可用的一些特性。

预览

当你在文字视图中编辑室,你可以通过点击窗口右边的Preview面板来在设备中预览布局。在Preview面板,你可以在面板顶部更改多个选项来更改预览,包括预览设备,布局主题,平台版本等等。如图:
这里写图片描述
要想在多个设备中模拟预览布局,在设备下拉框选择Preview All Screen Sizes。
当你点击预览图片,布局编辑器自动高亮并且定位到相应的位置。

交互错误检测和恢复

当你编辑文字试图中的XML布局文件时,Android Studio会实时提示错误并提供帮助。
比如,假设你添加了一个按钮,却拼成Buttonn。Android Studio会通过显示一个如下的错误来帮你纠正它。
这里写图片描述
Android Studio可以提示你补充遗漏的信息。比如,假设你添加一个Fragment到你的XML文件中。首先,Android Studio显示了一个自动完成的提示。一旦确定你添加一个fragment,Android Studio会显示一个带链接的错误来提示你补充遗漏的属性。点击Automatically add all missing attributes可以帮助你添加丢失的属性。如图:
这里写图片描述

选择一个主题

通过点击主题图标来为你的app选择一个主题。
这会打开Select Theme对话框,在这里你可以选择合适的主题并在右边选择合适的。如图:
这里写图片描述

本地化

Android Studio提供了内建的本地化支持。当你点击本地化按钮,选择一个特定的语言,可以实时预览。如图:
这里写图片描述

在设计视图中编辑

你可以通过点击窗口地步的Design来切换到图形编辑器视图。如图:
这里写图片描述

多API版本预览渲染

Android Studio支持多API版本渲染,当你在设计视图中点击Android版本,Android Studio允许你同时多个API预览你的Android布局。如图:
这里写图片描述

截图

当你在一个连接的设备上运行你的app的时候,你可以通过点击设计视图中的相机图标完成对app界面的截图。

本文作者:宋志辉
个人微博:点击进入

目录
相关文章
|
12月前
|
SQL 人工智能 Dart
Android Studio的插件生态非常丰富
Android Studio的插件生态非常丰富
679 1
|
12月前
|
Ubuntu Linux Android开发
Android Studio支持多种操作系统
Android Studio支持多种操作系统
548 1
|
7月前
|
开发工具 Android开发 iOS开发
如何在Android Studio中配置Flutter环境?
如何在Android Studio中配置Flutter环境?
1709 61
|
6月前
|
Android开发 Windows
Android studio 报错Connect to 127.0.0.1:8888 [/127.0.0.1] failed: Connection refused: connect(已解决)
这是一篇关于解决Android Studio报错“Connect to 127.0.0.1:8888 failed: Connection refused”的文章。问题通常因系统代理设置被Android Studio自动保存导致。解决方法是找到系统中Android Studio使用的gradle.properties文件(位于Windows的C:\Users\你的电脑用户名\.gradle或Mac的/Users/.{你的用户目录}/.gradle),删除或注释掉多余的代理配置后保存并重新Sync项目。希望此经验能帮助快速解决同类问题!
897 36
|
6月前
|
Java Android开发
Android studio中build.gradle文件简单介绍
本文解析了Android项目中build.gradle文件的作用,包括jcenter仓库配置、模块类型定义、包名设置及依赖管理,涵盖本地、库和远程依赖的区别。
583 19
|
9月前
|
前端开发 Java 编译器
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
252 36
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
|
9月前
|
Dart 前端开发 Android开发
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
266 4
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
6月前
|
开发框架 前端开发 JavaScript
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发一
本文介绍了方舟开发框架(ArkUI)及其两种开发范式:基于ArkTS的声明式开发范式和类Web开发范式。ArkUI是用于构建HarmonyOS应用界面的UI框架,提供极简UI语法和基础设施。声明式开发范式使用ArkTS语言,以组件、动画和状态管理为核心,适合复杂团队协作;类Web开发范式采用HML、CSS、JavaScript三段式开发,适用于简单界面应用,贴近Web开发者习惯。文中还概述了两者的架构和基础能力,帮助开发者选择合适的范式进行高效开发。
215 15
|
6月前
|
编解码 前端开发 Java
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发三
本文介绍了基于声明式UI范式的图形绘制与动画效果实现方法,涵盖绘制图形、添加动画效果及常见组件说明三部分内容。在绘制图形部分,详细讲解了如何通过Circle组件为食物成分表添加圆形标签,以及使用Path组件结合SVG命令绘制自定义图形(如应用Logo)。动画效果部分则展示了如何利用animateTo实现闪屏动画,包括渐出、放大效果,并设置页面跳转;同时介绍了页面间共享元素转场动画的实现方式。最后,文章列举了声明式开发范式中的各类组件及其功能,帮助开发者快速上手构建复杂交互页面。
240 11
|
2月前
|
存储 开发者 容器
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
本文介绍了ArkTS语言中的Class类、泛型、接口、模块化、自定义组件及状态管理等核心概念,并结合代码示例讲解了对象属性、构造方法、继承、静态成员、访问修饰符等内容,同时涵盖了路由管理、生命周期和Stage模型等应用开发关键知识点。
258 1
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例

热门文章

最新文章