How to create a view like this in Android?

Question

I want to create a layout look like as show in below image (note the red circle).

I have tried this with the help of horizontalScroll View and made a ugly one like below:

I want this looks like the above one, what should I use so that, I can get the vertical bars in between each temperature values,

And the other thing is that, is it possible to add multiple views in my horizontal scroll view as I have added only an dynamically created imageviews see my fig.

Here is code I have tried so far:

xml

<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="match_parent"
android:background="@drawable/world_map"
tools:context=".MainActivity" >

<TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/horizontalScrollView"
    android:layout_alignLeft="@+id/horizontalScrollView"
    android:text="Flags"
    android:textAppearance="?android:attr/textAppearanceMedium" />

<HorizontalScrollView
    android:id="@+id/horizontalScrollView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_marginLeft="80dp"
    android:padding="0dp"
    android:scrollbars="none" >

    <LinearLayout
        android:id="@+id/rootlinear"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:padding="0dp" >
    </LinearLayout>
</HorizontalScrollView>
</RelativeLayout>

java

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.dynamic_views);
            createViewsDynamically(context);

}

private void createViewsDynamically(final Context context) {
    // TODO Auto-generated method stub

    LinearLayout rootLayout = (LinearLayout) findViewById(R.id.rootlinear);
    for (int i = 0; i < flags.length; i++) {

        ImageView img = new ImageView(context);
        img.setBackgroundResource(flags[i]);
        img.setLayoutParams(new ViewGroup.LayoutParams(80,90));

        img.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {

                Toast.makeText(context, "Test", duration).show();
            }
        });

        rootLayout.addView(img);

    }

}

Answer 1

You want to show list of items in horizontal form. I can say that your solution is horizontal scroll view. Visit this link it demonstrate a horizontal list view:

http://www.androiddevelopersolution.com/2012/11/horizontal-listview-in-android-example.html