94

我想创建帮助覆盖，就像您在第一次加载 ICS 时看到的那样，或者在 ES File Explorer 或 Apex Launcher 等应用程序中看到的那样（还有更多，但我现在想不起来）。这只是一种相对布局，一个视图位于另一个视图之上吗？我还没有找到任何示例代码来做这样的事情。有人知道这是如何完成的或有任何想法吗？

ES 文件资源管理器 ES 文件资源管理器

4

4 回答 4

85

假设您通常会调用setContentView(R.layout.main)，但在第一次运行时，您希望拥有此叠加层。

步骤 #1：在 Java 代码中创建一个FrameLayout并将其传递给setContentView().

步骤#2：使用LayoutInflater充气R.layout.main到FrameLayout.

第 3 步：用于LayoutInflater将叠加层膨胀到FrameLayout.

步骤#4：当用户点击按钮（或其他）以关闭覆盖时，调用removeView()以从FrameLayout.

由于叠加层是 的后一个子级FrameLayout，它会浮在 的内容之上R.layout.main。

于 2012-04-18T19:59:34.357 回答
80

“教练标记”是 UX 谈话中的“帮助覆盖”:-)

coach_mark.xml是您的教练标记布局

coach_mark_master_view是coach_mark.xml 中最顶层视图（根）的ID

public void onCoachMark(){

    final Dialog dialog = new Dialog(this);
    dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
    dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
    dialog.setContentView(R.layout.coach_mark);
    dialog.setCanceledOnTouchOutside(true);
    //for dismissing anywhere you touch
    View masterView = dialog.findViewById(R.id.coach_mark_master_view);
    masterView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            dialog.dismiss();
        }
    });
    dialog.show();
}

添加coach_mark.xml 的示例（Oded Breiner 给出的这个优秀的解决方案），这样用户可以很容易地复制和粘贴以快速查看工作示例。

此处为 coach_mark.xml 示例，将 -> drawable/coach_marks 更改为您的图像：

教练标记.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:id="@+id/coach_mark_master_view">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
         <ImageView
             android:id="@+id/coach_marks_image"
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             android:layout_centerInParent="true"
             android:layout_gravity="center_horizontal"
             android:src="@drawable/coach_marks" />
    </RelativeLayout>
</LinearLayout>

并且可以选择使用这个主题来删除填充：

<style name="WalkthroughTheme" parent="Theme.AppCompat">
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:backgroundDimEnabled">false</item>
</style>
于 2013-06-13T15:49:08.073 回答
4

你可以很快做到这一点。例如，您添加了一个 LinearLayout，您可以在其中放置一张带有 alpha 的图片，该图片对应于您的帮助信息以及您想要像叠加层一样绘制什么。在您的活动的 xml 中，您将此布局放在具有“消失”可见性的活动布局之后的 RelativeLayout 中。当您想绘制帮助信息时，您只需要将这个可见性设置为可见。

我希望，我很清楚，如果您有任何问题，我很乐意回答他们。

于 2012-04-18T19:59:00.640 回答
1

请参阅我的另一个答案，如何以编程方式在当前活动之上显示覆盖布局。Activity 的 layout.xml 不需要知道关于覆盖皮肤的任何信息。您可以将覆盖半透明，仅覆盖屏幕的一部分，一个或多个文本视图和按钮...... 如何以编程方式覆盖按钮？

  • 创建 res/layout/paused.xml RelativeLayout 模板或使用任何布局顶层
  • 创建一个函数来显示覆盖皮肤
  • 关键是获取 layout.xml 的句柄，使用 LayoutInflater 类解析 xml 以查看对象，将叠加视图添加到当前布局结构
  • 我的示例使用计时器通过将覆盖对象从视图结构中完全删除来销毁它。这可能也是你想要摆脱它而不留痕迹的东西。

我的目标是主要活动不知道任何覆盖皮肤，覆盖来来去去，许多不同的覆盖，仍然能够使用 overlay1.xml 文本文件作为模板，并且应该以编程方式更新内容。我所做的几乎都是 CommonsWare 告诉我们的，我的帖子显示了开始使用的实际程序代码。

免责声明：OP“感谢您的输入。这就是我想象的完成方式。我必须感谢下面的答案”评论并不意味着我的答案，而是 CommonsWare 的答案。Stackoverflow 已更改发布顺序。

于 2013-01-12T19:03:09.273 回答