android+preview固定,Android Studio preview 不固定及常见问题的解决办法

Android Studio提供了一个强大的“Preview”工具,可以帮助您预览您的布局文件将如何在用户的设备上呈现。XML布局可能是Android开发中最常用的资源。 您的项目中每个活动至少有一个布局文件。 Android Studio的预览工具可帮助您实现这些伟大的设计,并快速迭代它们,甚至不需要运行您的应用程序。它还允许您查看布局的不同配置,例如在纵向或横向时的外观,或者TextView在多个语言环境(如英语,德语或希腊语)上的外观。

即使预览工具是强大的,可以使你的发展日子轻而易举,与此同时,它也有一些缺点会让程序猿抓狂。这篇文章谈论Preview的常见问题和技巧。

前阵子用 AndroidStudio,不知道点错了什么按钮,preview 视图窗口不是固定在一侧。只要点击 xml 界面,就隐藏了 preview 窗口,根本开发不了。找来找去,发现设置处没有docked mode属性。

64e8d97f7818d5d8a289039831cf4c40.png

没有 docked mode 属性

网上找了很多资料,才解决了。办法如下:

点击preview,显示视图窗口;

点击菜单栏的window;

选中Active Tool Window;

选中Docked Mode;

7288ababe02613770773798c0759a6f9.png

操作

这里是最常见的关于Preview的问题列表和解决方案(图片请右键用新标签放大查看):

问题1:Preview看起来为空

假设你有一个布局,其内容将从后端获得的数据填充…你很快意识到,由于内容是动态的,预览工具不能填充屏幕,你什么也看不到。对这个问题的一个较为简单解决方案是在真机上测试,那时你有这些数据,但是这样Preview的意义就失去了。

32bf1bb1b3725b5f8420f6b68d623bcc.png

在这种情况下的问题是TextView和ImageView没有任何内容可供显示。 这是处理动态内容时的常见问题。即使代码编译没有问题,没有人可以在不查看XML代码的情况下理解该布局。

当创建使用任何后端数据相关视图的布局时,一个好的做法是仅在预览时填充它。通过使用tools命名空间而不是android来声明xml属性,这将允许您指定只在预览时使用的属性。例如我们使用tools:text =“Title”和tools:src =“@ drawable / cool_pic”,大功告成!

17422ba5345f7606775be931a74ae0de.png

使用tools前缀声明的属性完全与android一样,但仅用于预览。使用tools:text 而不是Android:text,保证了你所有的内容都只是在预览的时候会出现,程序运行起来不会出现所有tools相关的东西。

如果你没有足够的符合所有ImageView要求的宽高比的图片(jpg等),会发生什么? 您可以让设计狮提供一些资源来测试各种适配,不过这可能需要一些额外的努力和维护;这时也可以使用tools:rcs或者tools:layout_height和tools:layout_width来测试显示效果,而不必修改真实属性。

问题2:测试最大宽高

或者当您的布局旨在显示来自外部源的一些内容时,它有时被要求具有一些最大宽度或/和高度(也就是使用了maxHeight属性),来确保您的布局看起来美观,即使外部源发送大于预期或某些宽高比未被同意的图像。这时可以使用tools:layout_height和tools:layout_width,并且设置一个固定颜色的toos:background来预览各个尺寸下的图片可以在ImageView中占用的空间。

f901cb4770bbc227f3768332cd815ae9.png

问题3:修复损坏的预览

如下图所示的错误经常发生:创建自定义View时,务必确保您的视图可以实例化,而不使用任何在预览期间可能不存在的外部依赖项。请记住,预览不会在应用程序中运行,而是在IDE中的JVM上运行。 这将模拟在Android设备上的工作原理,你应该假设你不能访问任何数量的不在View框架内的依赖。使用例如Glide的图像加载器将是不可能的。 出于同样的原因,任何依赖注入框架将不工作,因为它不会在预览上下文中初始化,导致视图在被扩充时抛出异常。

945877536922338142b0dd7db6d44f60.png

在这种情况下可以使用View.isInEditMode()。 使用它来检查您是否是正在预览,并跳过在Preview时不可用的依赖:

public ImageWithCaptionView(Context context, AttributeSet attrs) {

super(context, attrs);

if (!isInEditMode()) {

ArticlesApplication.getInjector().inject(this);

}

}

问题4:merge布局重叠

merge标签可以帮助您减少布局代码的重复。

然而,merge的问题是,它内部的所有组件将被折叠在一起,同时显示在预览里,造成视觉混乱。如下图所示,TextView覆盖在ImageView的上面:

f21d016ed3c4cbdd04f3b7f47a90d17b.png

您可以使用工具:tools:showIn=”layout”来显示使用它的一些其他现有布局内的布局的内容。 请注意,如果您在多个地方使用不同的父布局,则只能选择一个布局进行预览。

从Android Studio 2.2开始,您现在可以使用工具:parentTag =“LinearLayout”例如将渲染布局为LinearLayout。下图是使用后的效果,不再有重叠:

1f783fdb022e58054be4d68f0adad186.png

问题5:在预览时显示隐藏的视图

你的活动可能包含一些在onCreat时需要隐藏的View,但在一些事件后显示它们。通过设置这些视图在布局中的visibility:”GONE”,可以确保它们永远不会在预览时可见。

问题是,这些视图将从预览中消失,如果一些其他开发人员打开布局,并在预览中查找它们,他们将无法找到它。这是一个问题,因为它需要更多的精力和时间来了解屏幕上发生了什么。

您可以使用tools:visibility =“visible”属性,以仅在预览面板中显示它。

问题6:ListView的Item和Header/Footer预览

使用tools:listitem / tools:listheader / tools:listfooter可以实现在预览中增加item、header、footer的效果。例如:

xmlns:tools="http://schemas.android.com/tools"

android:id="@android:id/list"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:listitem="@layout/sample_list_item"

tools:listheader="@layout/sample_list_header"

tools:listitem="@layout/sample_list_footer" />

此特性在AS2.2有bug(无效),并在2.3中修复。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值