CODEWITHSUNDEEP
androidxml
John Joe
John Joe

Reputation: 12803

Adjust xml android with imageView,button and text

There has a listView and imageView in Activity A. If listView.size is equal to 0, it will display the image in the imageView, it not equal to 0, it will display the list.

This is the xml of my Activtiy A. I want to make the text and button display below the image but I found it so difficult to adjust. 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <ImageView

        android:src="@mipmap/data"
        android:paddingTop="30dp"
        android:layout_gravity="center"
        android:layout_width="330dp"
        android:layout_height="300dp"
        android:id="@+id/imageView2"
        android:paddingLeft="20dp"></ImageView>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="No Data"
        android:textSize="15dp"
        android:layout_marginLeft="140dp"
        android:paddingTop="160dp"
        android:textColor="@color/honey_dew2"
        android:layout_gravity="center"
        android:id="@+id/NoData"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Add Data"
        android:paddingTop="20dp"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="130dp"
        android:id="@+id/button2"
        android:layout_centerVertical="true" />



    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ListView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/listView2"
            android:layout_weight="1"
            android:layout_alignParentTop="true"
            android:layout_alignParentLeft="true" />



    </RelativeLayout>


</RelativeLayout>

This is what I want. Thanks

https://i.sstatic.net/OSL4I.png

Upvotes: 1

Views: 227

Answers (2)

Blake Yarbrough
Blake Yarbrough

Reputation: 2316

I think this is pretty much what you are looking for

<LinearLayout    
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

<ImageView
    android:src="@mipmap/data"
    android:paddingTop="30dp"
    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/imageView2"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@id/imageView2"
    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true"
    android:text="No alarms"
    android:textSize="15sp"
    android:textColor="@color/honey_dew2"
    android:id="@+id/NoData"/>

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true"
    android:text="Add alarms"
    android:paddingTop="48dp"
    android:id="@+id/button2" />

</LinearLayout>

Notice that I changed from a RelativeLayout to a LinearLayout with a orientation value of vertical. I think that the RelativeLayout adds unnecessary complexity to this problem.

By using the layout_centerVertical and layout_centerHorizontal attributes instead of the padding you solve two problems at once.

  1. The position now scales to different devices.
  2. The layout is far less complex.

Notice also that the TextView textSize attribute is now in the units sp (scaling pixels) instead of dp (density-independent pixels). The size of your text should always be defined in sp and the size of your views should be defined either relatively or in dp.

This tutorial from the prolific mkyong should provide a strong foundation for manipulating the XML with your Java code.

Upvotes: 1

Gabe Sechan
Gabe Sechan

Reputation: 93569

I'd rework your entire approach. Use ListView.setEmptyView(View) to set a separate view to display when the list is empty. Then your base layout is just the list, and you have a separate layout for what to display for the empty case.

Upvotes: 1

Related Questions