2

Background

In the following screenshot from Gmail, there is some sort of error bar shown just underneath the action bar / app bar. This bar shows permanently, and it pushes the remaining content down rather than overlaying it.

enter image description here

Questions

  • Is there a name for this type of UI component/control?
  • Is there something built-in or in the support libraries that I can use to add one of these to an activity of my own?
Community
  • 1
  • 1
Sam
  • 40,644
  • 36
  • 176
  • 219
  • looks more like snackbar https://material.google.com/components/snackbars-toasts.html – karan Nov 16 '16 at 07:03
  • Hmm..I'm not sure if it is a full blown widget, might just be a layout with a TextView. – Veneet Reddy Nov 16 '16 at 07:03
  • @KaranMer, it does look similar, but as far as I know, snack bars are temporary and appear over the top of other things. This bar is permanent and pushes the content down. – Sam Nov 16 '16 at 07:13
  • 1
    @Sam: check this answer to know more http://stackoverflow.com/questions/29921663/how-to-prevent-snackbar-from-closing – karan Nov 16 '16 at 07:14

3 Answers3

1

Material design has an example of this under the App Errors section. It refers to the control as:

Container/component specific error with action

However, I also found an example in the Android Unified Email app, which refers to the control as Tip View:

I adapted the source code from the above to make my own:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tip_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#e5e5e5"
    android:orientation="vertical"
    android:paddingTop="16dp"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    >

    <TextView
        android:id="@+id/tip_view_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:textColor="@android:color/primary_text_light"
        android:textSize="16sp"
        />

    <Button
        android:id="@+id/tip_view_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical|right|end"
        android:text="@string/preference_accessibility_service_enable"
        style="@style/Widget.AppCompat.Button.Borderless.Colored"/>
        />

</LinearLayout>
Sam
  • 40,644
  • 36
  • 176
  • 219
0

If it is a Snackbar like @Karan says you can make it appear on the top like this:

Snackbar snack = Snackbar.make(parentLayout, str, Snackbar.LENGTH_LONG);
View view = snack.getView();
FrameLayout.LayoutParams params =(FrameLayout.LayoutParams)view.getLayoutParams();
params.gravity = Gravity.TOP;
view.setLayoutParams(params);
snack.show();

This shows an animation of Snackbar sliding from bottom, then switching to top. If you want to avoid this try this library(I haven't tried this myself): https://github.com/AndreiD/TSnackBar

Veneet Reddy
  • 2,707
  • 1
  • 24
  • 40
-1

Add a view inside of your current layout as per your design and make visibility gone, and make it visible when required from your activity/fragment. when this will appear in the screen it pushes the remain content down from the current position.

For elevation you can use CARDVIEW.

hopefully it will help you;