CODEWITHSUNDEEP
android
Robby Smet
Robby Smet

Reputation: 4661

Show a sort of help 'overlay'

I want to make my application a bit more user friendly so I was thinking of showing a sort of overlay that highlights different components when the user starts the application for the first time.

What is the best way to start implementing this?

Here is an example:

enter image description here

Upvotes: 3

Views: 1765

Answers (2)

Sobo
Sobo

Reputation: 497

overlay

I know this is rather old, but I found this and made some slight modifications. Works great for me.

Create and copy your "overlay.png" file into "drawable"

Create layout/overlay_activity.xml

<?xml version="1.0" encoding="utf-8"?>

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/Overlay_activity"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background= "@null"
        android:orientation="vertical" >

    <ImageView
        android:id="@+id/ivOverlayEntertask"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:src="@drawable/overlay" />

</LinearLayout>

Create xml/overlay_prefs.xml

<?xml version="1.0" encoding="utf-8"?>
<PreferenceScreen xmlns:android="http://schemas.android.com/apk/res/android" >

    <CheckBoxPreference
        android:defaultValue="true"
        android:key="overlaypref"
        android:summary="Enable Overlay Screen"
        android:title="Overlay Screen" />

</PreferenceScreen>

In your Activity, create and instance of SharedPreferences and a boolean to store the value:

SharedPreferences setOverlay;
boolean showOverlay;

Then in OnCreate get the value for the overlay CheckBoxPreference and if it's true, overlay the image onto the Activity:

setOverlay = PreferenceManager.getDefaultSharedPreferences(this);
showOverlay = setOverlay.getBoolean("overlaypref", true);
    if (showOverlay == true) {
    showActivityOverlay();
    }

Create a New Method in Activity: showActivityOverlay() What this Method does is, it shows the Overlay when the Activity starts and then when the user taps on the screen it will set the "overlaypref" to "false" and will no longer show the overlay.

  private void showActivityOverlay() {
      final Dialog dialog = new Dialog(this,
      android.R.style.Theme_Translucent_NoTitleBar);

      dialog.setContentView(R.layout.overlay_activity);

      LinearLayout layout = (LinearLayout) dialog
      .findViewById(R.id.overlay_activity);
      layout.setBackgroundColor(Color.TRANSPARENT);
        layout.setOnClickListener(new OnClickListener() {

          @Override
          public void onClick(View arg0) {
              dialog.dismiss();
              SharedPreferences.Editor editor = setOverlay.edit();
              editor.putBoolean("overlaypref", false);
              editor.commit();
          }
      });
      dialog.show();
  }

Upvotes: 5

toadzky
toadzky

Reputation: 3846

Use a frame or relative layout. 

<RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent">
  <include layout="@layout/normalLayout" />
  <include layout="@layout/overlayLayout" />
</RelativeLayout>

In your onCreate, check if you need the overlay, and if you do, setContentView to the overlay version. When they click, you could either hide the overlay or setContentView to the regular layout.

Upvotes: 1

Related Questions