Reputation: 1083

ListView Breaking Layout

I want a simple setup where i have a layout with 2 columns, and within each, I will nest other layouts and controls. As my root layout I use a GridLayout and so far it was going well:

The moment I added ListView to my first main column, it ignored the confines of the first column. I have tried everythring I know and even nested the ListView inside other layouts but I always end up with this:

Here is the xml of my layout so far:

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="2"
tools:context="com.example.mycoffeeshops.MainActivity">

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_column="0"
    android:layout_columnWeight="1"
    android:orientation="vertical">

    <TextView
        android:id="@+id/cofeeShopsTitleLabel"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:width="0dp"
        android:gravity="center_horizontal"
        android:text="@string/coffee_shops_title"
        android:textSize="@dimen/coffee_shops_title"
        android:textStyle="bold" />

    <GridLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:columnCount="3">

        <TextView
            android:id="@+id/shopLabelLabel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:layout_columnWeight="1"
            android:width="0dp"
            android:text="@string/shop_label" />

        <EditText
            android:id="@+id/shopLabelEditText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:layout_columnWeight="3"
            android:width="0dp"
            android:ems="10"
            android:hint="@string/shop_label_hint"
            android:inputType="textPersonName" />

        <ImageButton
            android:id="@+id/saveCoffeeShopImageButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="2"
            app:srcCompat="@android:drawable/ic_menu_save" />
    </GridLayout>

    <GridLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:columnCount="3">

        <TextView
            android:id="@+id/descriptionLabel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:layout_columnWeight="1"
            android:width="0dp"
            android:text="@string/shop_label" />

        <EditText
            android:id="@+id/descriptionEditText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:layout_columnWeight="3"
            android:width="0dp"
            android:ems="10"
            android:hint="@string/description_hint"
            android:inputType="textPersonName" />

        <Space
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="2"
            android:layout_columnWeight="0.5" />

    </GridLayout>

    <TextView
        android:id="@+id/coffeeShopListLabel"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:width="0dp"
        android:gravity="center_horizontal"
        android:paddingBottom="@dimen/coffee_shop_list_label_padding_bottom"
        android:paddingTop="@dimen/coffee_shop_list_label_padding_top"
        android:text="@string/coffee_shops_list_label"
        android:textSize="@dimen/coffee_shops_list_label_text_size"
        android:textStyle="bold" />

    <ListView
        android:id="@+id/shopListListView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_column="1"
    android:layout_columnWeight="1"
    android:orientation="vertical">

    <TextView
        android:id="@+id/detailedIformationTitleLabel"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:width="0dp"
        android:gravity="center_horizontal"
        android:text="@string/detailed_information_title"
        android:textSize="@dimen/coffee_shops_title" />
</LinearLayout>

Upvotes: 0

Answers (1)

Sho_arg

Reputation: 383

Here is the code as you want. this work fine with me

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="100"
tools:context="com.example.mycoffeeshops.MainActivity">

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

    <Space
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1" />

    <TextView
        android:id="@+id/cofeeShopsTitleLabel"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:width="0dp"
        android:gravity="center_horizontal"
        android:text="@string/coffee_shops_title"
        android:textSize="@dimen/coffee_shops_title"
        android:textStyle="bold" />

    <GridLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:columnCount="3">

        <TextView
            android:id="@+id/shopLabelLabel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:layout_columnWeight="1"
            android:width="0dp"
            android:text="@string/shop_label" />

        <EditText
            android:id="@+id/shopLabelEditText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:layout_columnWeight="3"
            android:width="0dp"
            android:ems="10"
            android:hint="@string/shop_label_hint"
            android:inputType="textPersonName" />

        <ImageButton
            android:id="@+id/saveCoffeeShopImageButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="2"
            app:srcCompat="@android:drawable/ic_menu_save" />
    </GridLayout>

    <GridLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:columnCount="3">

        <TextView
            android:id="@+id/descriptionLabel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:layout_columnWeight="1"
            android:width="0dp"
            android:text="@string/shop_label" />

        <EditText
            android:id="@+id/descriptionEditText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:layout_columnWeight="3"
            android:width="0dp"
            android:ems="10"
            android:hint="@string/description_hint"
            android:inputType="textPersonName" />

    </GridLayout>

    <TextView
        android:id="@+id/coffeeShopListLabel"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:width="0dp"
        android:gravity="center_horizontal"
        android:paddingBottom="@dimen/coffee_shop_list_label_padding_bottom"
        android:paddingTop="@dimen/coffee_shop_list_label_padding_top"
        android:text="@string/coffee_shops_list_label"
        android:textSize="@dimen/coffee_shops_list_label_text_size"
        android:textStyle="bold" />

        <ListView
            android:id="@+id/shopListListView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
             />

</LinearLayout>

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

    <TextView
        android:id="@+id/detailedIformationTitleLabel"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:width="0dp"
        android:gravity="center_horizontal"
        android:text="@string/detailed_information_title"
        android:textSize="@dimen/coffee_shops_title" />
</LinearLayout>
</LinearLayout>

but try to use ConstraintLayout. By ConstraintLayout you can achieve this type of layouts easily.

tutorial :- https://developer.android.com/training/constraint-layout/index.html

Upvotes: 2

ListView Breaking Layout

Answers (1)

Related Questions