0

I want to implement the following design:

Screen Shot

These five options are displayed on clicking an imageview.I am implementing this design using dialog.

1.moreOption.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:weightSum="1">

    <TextView
        android:id="@+id/viewContacts"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/margin10"
        android:text="View Contacts"
        android:textSize="20sp" />

    <View
        android:layout_width="fill_parent"
        android:layout_height="2dp"
        android:background="#c0c0c0" />

    <TextView
        android:id="@+id/archiveChat"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/margin10"
        android:text="Archive Chat"
        android:textSize="20sp" />

    <View
        android:layout_width="fill_parent"
        android:layout_height="2dp"
        android:background="#c0c0c0" />

    <TextView
        android:id="@+id/deleteChat"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/margin10"
        android:text="Delete Chat"
        android:textSize="20sp" />

    <View
        android:layout_width="fill_parent"
        android:layout_height="2dp"
        android:background="#c0c0c0" />

    <TextView
        android:id="@+id/markAsUnread"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/margin10"
        android:text="Mark as unread"
        android:textSize="20sp" />

    <View
        android:layout_width="fill_parent"
        android:layout_height="2dp"
        android:background="#c0c0c0" />

    <TextView
        android:id="@+id/emailChat"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/margin10"
        android:text="Email Chat"
        android:textSize="20sp" />
</LinearLayout>

Below is the code that is displaying dialog on clicking imageview.

   ImageView imgMoreOption = (ImageView) view.findViewById(R.id.imgMoreoption);

   imgMoreOption.setOnClickListener(new View.OnClickListener() {
       @Override
       public void onClick(View view) {
           Dialog dialog = new Dialog(context);
           dialog.setContentView(R.layout.more_option);
           dialog.show();
       }
   });

Now on clicking imageview i am getting the following screenshot.

screenshot

But using dialog ,i am not getting according to the design given as from the top i ma getting much space .Please guide me how to implement the given design .

Edited Code

I have fixed the issue.Actually dialog was displaying the empty title.I have changed the code as given below:

imgMoreOption.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            Dialog dialog = new Dialog(context);
            dialog.requestWindowFeature(Window.FEATURE_NO_TITLE); // hide the title bar
            dialog.setContentView(R.layout.more_option);
            dialog.show();
        }
    });

moreOption.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:weightSum="1">

    <TextView
        android:id="@+id/viewContacts"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/margin10"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/margin10"
        android:text="View Contacts"
        android:textSize="20sp" />

    <View
        android:layout_width="fill_parent"
        android:layout_height="1dp"
        android:layout_marginTop="@dimen/margin10"
        android:background="#c0c0c0" />

    <TextView
        android:id="@+id/archiveChat"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/margin10"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/margin10"
        android:text="Archive Chat"
        android:textSize="20sp" />

    <View
        android:layout_width="fill_parent"
        android:layout_height="1dp"
        android:layout_marginTop="@dimen/margin10"
        android:background="#c0c0c0" />

    <TextView
        android:id="@+id/deleteChat"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/margin10"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/margin10"
        android:text="Delete Chat"
        android:textSize="20sp" />

    <View
        android:layout_width="fill_parent"
        android:layout_height="1dp"
        android:layout_marginTop="@dimen/margin10"
        android:background="#c0c0c0" />

    <TextView
        android:id="@+id/markAsUnread"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/margin10"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/margin10"
        android:text="Mark as unread"
        android:textSize="20sp" />

    <View
        android:layout_width="fill_parent"
        android:layout_height="1dp"
        android:layout_marginTop="@dimen/margin10"
        android:background="#c0c0c0" />

    <TextView
        android:id="@+id/emailChat"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="@dimen/margin10"
        android:layout_marginTop="@dimen/margin10"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/margin10"
        android:text="Email Chat"
        android:textSize="20sp" />


</LinearLayout>
Rami
  • 7,879
  • 12
  • 36
  • 66
Deepak Rattan
  • 1,279
  • 7
  • 21
  • 47

3 Answers3

1

you should remove your Dialog's title bar.

use

dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);

and for TextViews you can use one of android pre defined styles or your custom style

add this to your TextViews in xml file

style="?android:attr/listSeparatorTextViewStyle"
Mohammad Rahchamani
  • 5,002
  • 1
  • 26
  • 36
1

1) While you're using the weight, its better if you change android:layout_height="wrap_content" to android:layout_height="0dp" in your TextViews.

2) Add requestWindowFeature(Window.FEATURE_NO_TITLE); to remove the title bar/layout (the blanc space)

@Override
public void onClick(View view) {
    Dialog dialog = new Dialog(context);
    dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
    dialog.setContentView(R.layout.more_option);
    dialog.show();
}

PS: It's better if you use a fixed height of your LinearLayout, or a fixed height for the TextViews.

Rami
  • 7,879
  • 12
  • 36
  • 66
0

You can do it like this:

<?xml version="1.0" encoding="utf-8"?>
  <RelativeLayout
      xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:showIn="@layout/activity_main"
    tools:context="com.pathfinder.myapplication.MainActivity">
    <TextView
        android:layout_marginTop="16dp"
        android:layout_marginBottom="16dp"
        android:id="@+id/viewContacts"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="16dp"
        android:text="View Contacts"
        android:textSize="20sp" />

    <View
        android:id="@+id/view1"
        android:layout_below="@+id/viewContacts"
        android:layout_width="fill_parent"
        android:layout_height="2dp"
        android:background="#c0c0c0" />

    <TextView
        android:layout_marginTop="16dp"
        android:layout_marginBottom="16dp"
        android:layout_below="@+id/view1"
        android:id="@+id/archiveChat"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="16dp"
        android:text="Archive Chat"
        android:textSize="20sp" />

    <View
        android:id="@+id/view2"
        android:layout_below="@+id/archiveChat"
        android:layout_width="fill_parent"
        android:layout_height="2dp"
        android:background="#c0c0c0" />

    <TextView
        android:layout_marginTop="16dp"
        android:layout_marginBottom="16dp"
        android:layout_below="@+id/view2"
        android:id="@+id/deleteChat"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="16dp"
        android:text="Delete Chat"
        android:textSize="20sp" />

    <View
        android:id="@+id/view3"
        android:layout_below="@id/deleteChat"
        android:layout_width="fill_parent"
        android:layout_height="2dp"
        android:background="#c0c0c0" />

    <TextView
        android:layout_marginTop="16dp"
        android:layout_marginBottom="16dp"
        android:layout_below="@id/view3"
        android:id="@+id/markAsUnread"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="16dp"
        android:text="Mark as unread"
        android:textSize="20sp" />

    <View
        android:id="@+id/view4"
        android:layout_below="@+id/markAsUnread"
        android:layout_width="fill_parent"
        android:layout_height="2dp"
        android:background="#c0c0c0" />

    <TextView
        android:layout_marginTop="16dp"
        android:layout_marginBottom="16dp"
        android:layout_below="@id/view4"
        android:id="@+id/emailChat"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight=".2"
        android:gravity="center_vertical"
        android:paddingLeft="16dp"
        android:text="Email Chat"
        android:textSize="20sp" />

</RelativeLayout>
androgo
  • 564
  • 2
  • 8