fklappan
fklappan

Reputation: 3259

Same aspect ratio of progressbar in custom listview

I have a listview with a custom row layout. In this custom row is a progressbar ( "circle" ) which indicates a loading state. To make the layout looks how i like it, im using layout_weight for the progressbar and the layout containing some other gui stuff.

Example:

<ProgressBar
    android:id="@+id/progressBar1"
    style="?android:attr/progressBarStyleSmall"
    android:layout_width="0dip" 
    android:layout_height="match_parent" 
    android:layout_weight="1" />


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="0dip" 
    android:layout_height="match_parent" 
    android:layout_weight="7"
    android:layout_marginLeft="6dip" 
    android:orientation="vertical"
    >

I want the progressbar to have the same aspect ratio.

My problem is that the progressbar looks weird on different devices. On my galaxy nexus everything looks fine and the progressbar has the same aspect ratio. But on - for example - my emulator, the progressbar looks like an egg and thats terrible.

Can someone please point out my error?

Edit:

I dont use wrap_content because the layout will use the progressbar's width for the rest of the view, which is really tiny ( then there is no place for the text ).

Edit2:

Two pictures showing the problem:

The "egg" http://s14.directupload.net/file/d/2955/89xvdhrz_png.htm

Usage of the wrap_content http://s1.directupload.net/file/d/2955/sryrhkkk_png.htm

Edit3:

CFlex' approach. Whole xml-file

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent" 
android:layout_height="wrap_content" 
android:orientation="horizontal">

<ProgressBar
    android:id="@+id/progressBar1"
    style="?android:attr/progressBarStyleSmall"
    android:layout_width="wrap_content" 
    android:layout_height="match_parent" 
    android:layout_gravity="center"
    android:layout_margin="4dp"/>


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="0dip" 
    android:layout_height="match_parent" 
    android:layout_weight="7"
    android:layout_marginLeft="6dip" 
    android:orientation="vertical"
    >

    <TextView 
        android:id="@android:id/text1" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:textAppearance="?android:attr/textAppearanceLarge"/>

    <TextView 
        android:id="@android:id/text2" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:textAppearance="?android:attr/textAppearanceSmall"/>

</LinearLayout>

Upvotes: 2

Views: 1705

Answers (1)

AMerle
AMerle

Reputation: 4354

Why don't you try something like this:

<ProgressBar
    android:id="@+id/progressBar1"
    style="?android:attr/progressBarStyleSmall"
    android:layout_width="wrap_content" 
    android:layout_height="match_parent"  
    android:layout_gravity="center"
    android:layout_margin="4dp"/>


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="0dp" 
    android:layout_height="match_parent" 
    android:layout_weight="1"
    android:layout_marginLeft="6dip" 
    android:orientation="vertical"
    >

Assuming you are in a horizontal LinearLayout

Tell me if this does not work.

EDIT: with a relativeLayout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content">

    <ProgressBar
            android:id="@+id/progressBar1"
            style="?android:attr/progressBarStyleSmall"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignParentLeft="true"
            android:layout_centerVertical="true"
            android:layout_margin="4dp"/>

    <TextView
            android:id="@android:id/text1"
            android:layout_toRightOf="@+id/progressBar1"
            android:layout_alignParentTop="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceLarge"/>

    <TextView
            android:layout_toRightOf="@+id/progressBar1"
            android:layout_below="@android:id/text1"
            android:id="@android:id/text2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceSmall"/>

</RelativeLayout>

Upvotes: 4

Related Questions