James
James

Reputation: 6499

Laying out subviews in a layout programmatically

I'm trying to layout views in a relative layout on a tablet, much like a bookshelf. There will be so many across, then a new row is created.

My initial state looks like this:

  <ScrollView
    android:layout_marginTop="150sp"
    android:layout_marginLeft="50sp"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <RelativeLayout
      android:id="@+id/user_list"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content">

      <!-- Add User Avatar -->
        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">
            <ImageView
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:src="@drawable/user_frame" />
            <ImageView
                android:id="@+id/demo_image"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:src="@drawable/add_user"
                android:layout_marginLeft="10px" />
            <ImageView
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:src="@drawable/user_name_background"
                android:layout_marginLeft="10px" />
            <TextView
                android:id="@+id/user_name"
                android:layout_width="180px"
                android:layout_height="wrap_content"
                android:textSize="20sp"
                android:textStyle="bold"
                android:gravity="center_horizontal"
                android:text="Add New User" />
        </RelativeLayout>

      </RelativeLayout>
  </ScrollView>

I'm fetching records from a database, and for each record I need to place a version of the "add user avatar" section as seen above. I'd like to do 5, then wrap to a new row.

My initial idea was to use a layout inflater and add the views programmatically, using RelativeLayout.LayoutParams to set the layout_toRightOf values.

There must be an easier way though. I've seen lots of applications using the "bookshelf" metaphor.

Upvotes: 3

Views: 1498

Answers (2)

Colin
Colin

Reputation: 1119

Laying out views programmatically is fairly simple. I do this for all of my activities / views. I love Android's XML layout concept but find that as soon as the views become at all dynamic based on external data (such as your database) then it gets too complex.

I choose what my outermost layout will be and then only instantiate that layout in the XML. Then in my activity I find the outer layout using the normal find by id call and then use a sequence of add(View) method calls to add my dynamically created views or layouts as needed.

You will need to take into account different screen orientations, pixel densities and sizes. Device Independent Pixels will become your friend. For example, to create an image view, you would load the bitmap, figure out how much to resize it (if needed) and then set it as the drawable for a new ImageView instance, that you then add to the layout.

Sounds like your outer layout will be a scroll view with a vertical linear layout inside, that then has a horizontal layout for each "shelf" that then have up to five image views for each "book"

Upvotes: 3

MrZander
MrZander

Reputation: 3120

There are a few options I can think of.

  1. Instead of using a relative layout, why not use LinearLayouts with the horizontal attribute?
  2. Using a TableLayout, much like the LinearLayout
  3. Use a ListView with a custom adapter to fill five 'Add User Avatar's' per ListRow

Upvotes: 3

Related Questions