0

I am a bit new to Android and I am making an interface sort of like Instagram has theirs. I made a layout file and I am not sure if I am doing it a proper way. First can anyone tell me if what I have is correct? And second, how can I change the layout but still have the bottom buttons there in all of the layouts.

This is my main layout:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <LinearLayout
        android:id="@+id/theContent"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="9"
        android:orientation="vertical">

        <ListView
            android:id="@+id/list"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:scrollbars="none"
            android:divider="@null" />

    </LinearLayout>

    <LinearLayout
        android:id="@+id/theNav"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal">

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/darker_gray"
            android:src="@drawable/button1"
            android:id="@+id/button1" />

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/darker_gray"
            android:src="@drawable/button2"
            android:id="@+id/button2"/>

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/darker_gray"
            android:src="@drawable/button3"
            android:id="@+id/button3" />

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/darker_gray"
            android:src="@drawable/button4"
            android:id="@+id/button4" />

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/darker_gray"
            android:src="@drawable/button5"
            android:id="@+id/button5" />

    </LinearLayout>

</LinearLayout>

what I am saying is, how can I swap out that ListView for another layout on a button click?

Alexiz Hernandez
  • 609
  • 2
  • 9
  • 31

2 Answers2

1

Few ways you can do that:

  1. Have multiple layouts in xml and then change visibility (I do not recommend for regular use)

  2. Add remove layouts & views (again possible this way, but wouldn't recommend).

  3. Fragments - add, remove fragments which have implementation of each layout (recommended way) More about fragments here: fragments

You can have fragment with ListView, then number of different fragments with other layouts (each fragment can have separate xml layout file). And then on button click you can add, replace, remove fragments. Here's more info about fragment transaction.

Community
  • 1
  • 1
JuliusScript
  • 3,850
  • 1
  • 17
  • 17
0

Take advantage of ViewPager which contains Fragments, below is the code for your view, but fragments should be instantiated in the code and each will have their own views.

Read here:

http://developer.android.com/training/animation/screen-slide.html

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <!--This is the pages container-->
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <LinearLayout
        android:id="@+id/theNav"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal">

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/darker_gray"
            android:src="@drawable/button1"
            android:id="@+id/button1" />

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/darker_gray"
            android:src="@drawable/button2"
            android:id="@+id/button2"/>

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/darker_gray"
            android:src="@drawable/button3"
            android:id="@+id/button3" />

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/darker_gray"
            android:src="@drawable/button4"
            android:id="@+id/button4" />

        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/darker_gray"
            android:src="@drawable/button5"
            android:id="@+id/button5" />

    </LinearLayout>

</LinearLayout>
Iliiaz Akhmedov
  • 867
  • 7
  • 17