Relative Layout, как бар Прогресс [Android]

Question

Вот моя проблема:

создать список достижений, как этот

На самом деле, у меня есть такого рода элементов в моем списке зрения достижения

Вот XML код моего элемента в списке:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:id="@+id/relative_layout_rewards"> 



    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="60dip" 
     android:orientation="horizontal" 
     android:id="@+id/layout_title_rewards"> 




     <TextView 
      android:layout_width="0dip" 
      android:layout_height="wrap_content" 
      android:layout_weight="5" 
      android:text="" 
      android:textSize="13sp" 
      android:padding="10dip" 
      android:id="@+id/title_rewards" 
      android:maxLines="2" 
      android:textStyle="bold"/> 


     <TextView 
      android:id="@+id/number_rewards" 
      android:layout_width="0dip" 
      android:layout_height="wrap_content" 
      android:layout_weight="2" 
      android:gravity="center" 
      android:textSize="12sp" 
      android:padding="10dip" 
      android:text="" 
      android:textStyle="italic"/> 



    </LinearLayout> 

    <View 
     android:id="@+id/rewards_progressbar" 
     android:layout_below="@+id/layout_title_rewards" 
     android:layout_width="match_parent" 
     android:layout_height="3dip" 
     android:background="@color/blue" 
     android:layout_alignParentRight="true" 
     android:layout_alignParentEnd="true" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentStart="true"/> 

    <RelativeLayout 
     android:id="@+id/layout_rewards_progress_bar_view" 
     android:layout_width="100dip" 
     android:layout_height="60dip" 
     android:background="@color/blue"> 


     <TextView 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:id="@+id/layout_rewards_title_rewards_text" 
      android:layout_alignParentTop="true" 
      android:layout_alignParentLeft="true" 
      android:textSize="13sp" 
      android:padding="10dip" 
      android:maxLines="2" 
      android:textStyle="bold" 
      android:text="5 points scored in online game" 
      android:textColor="@color/white" 
      android:ellipsize="end"/> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/layout_rewards_points_rewards_text" 
      android:layout_alignParentTop="true" 
      android:layout_toRightOf="@+id/layout_rewards_title_rewards_text" 
      android:layout_toEndOf="@+id/layout_rewards_title_rewards_text" 
      android:gravity="center_horizontal" 
      android:textSize="12sp" 
      android:padding="10dip" 
      android:text="2/5" 
      android:textStyle="italic" 
      android:textColor="@color/white"/> 
    </RelativeLayout> 


</RelativeLayout> 

Для второго макета, который приходит по первому, я просто настраиваю ширину в java в соответствии с процентом достижения.

Мне хотелось бы получить тот же результат, что и первый снимок.

Любые идеи?

спасибо.

Answer 1

Для этого вам нужно использовать в FrameLayout

См. Этот образец, который я создал. вы просто заменить TextView с содержанием

Моя активность кода

public class CustProgress extends Activity { 
private FrameLayout mlayFrameLayout; 
private RelativeLayout mProgressHolder; 
private Handler handler; 
private int width = 0, progresswidth = 0; 

@Override 
public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 
    mlayFrameLayout = (FrameLayout) findViewById(R.id.progress); 
    mProgressHolder = (RelativeLayout) findViewById(R.id.progressHolder); 
    progresswidth = mProgressHolder.getLayoutParams().width; 
    handler = new Handler(); 
    doProgress(); 

} 

private void doProgress() { 
    handler.postDelayed(r, 1000); 
} 

Runnable r = new Runnable() { 

    @Override 
    public void run() { 
    //if (width <= progresswidth) { 
      width=width+10; 
      RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(width,100); 
      mlayFrameLayout.setLayoutParams(layoutParams); 

      doProgress(); 
      //   } 
    } 
}; 

    } 

это мой XML-код

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:orientation="vertical" > 

<RelativeLayout 
    android:id="@+id/progressHolder" 
    android:layout_width="match_parent" 
    android:layout_height="100dip" > 

    <FrameLayout 
     android:id="@+id/progress" 
     android:layout_width="0dip" 
     android:layout_height="match_parent" 
     android:background="@android:color/holo_blue_bright" > 
    </FrameLayout> 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:gravity="center" > 

     <TextView 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:gravity="center" 
      android:text="Loading.." /> 
    </RelativeLayout> 
</RelativeLayout> 

Answer 2

Я не знаю, как изменить цвет текста и цвет представления прогресса одновременно. , но я выложу дизайн.

Использование FrameLayout

<LinearLayout 
    android:id="@+id/layout_title_rewards" 
    android:layout_width="match_parent" 
    android:layout_height="60dip" 
    android:background="#000" 
    android:orientation="horizontal"> 


    <TextView 
     android:id="@+id/title_rewards" 
     android:layout_width="0dip" 
     android:layout_height="wrap_content" 
     android:layout_weight="5" 
     android:maxLines="2" 
     android:padding="10dip" 
     android:text="" 
     android:textSize="13sp" 
     android:textStyle="bold" /> 


    <TextView 
     android:id="@+id/number_rewards" 
     android:layout_width="0dip" 
     android:layout_height="wrap_content" 
     android:layout_weight="2" 
     android:gravity="center" 
     android:padding="10dip" 
     android:text="" 
     android:textSize="12sp" 
     android:textStyle="italic" /> 


</LinearLayout> 


<FrameLayout 
    android:id="@+id/layout_rewards_progress_bar_view" 
    android:layout_width="match_parent" 
    android:layout_height="60dip" 
    android:background="@color/colorPrimary"> 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:background="@android:color/transparent" 
     android:gravity="center_vertical"> 

     <TextView 
      android:id="@+id/layout_rewards_title_rewards_text" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_alignParentStart="true" 
      android:layout_alignParentTop="true" 
      android:ellipsize="end" 
      android:maxLines="2" 
      android:padding="10dip" 
      android:text="5 points scored in online game" 
      android:textColor="#fff" 
      android:textSize="13sp" 
      android:textStyle="bold" /> 

     <TextView 
      android:id="@+id/layout_rewards_points_rewards_text" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_alignParentEnd="true" 
      android:layout_alignParentTop="true" 
      android:layout_toEndOf="@+id/layout_rewards_title_rewards_text" 
      android:layout_toRightOf="@+id/layout_rewards_title_rewards_text" 
      android:gravity="end" 
      android:padding="10dip" 
      android:text="2/5" 
      android:textColor="#fff" 
      android:textSize="12sp" 
      android:textStyle="italic" /> 
    </RelativeLayout> 
</FrameLayout> 

<View 
    android:id="@+id/rewards_progressbar" 
    android:layout_width="match_parent" 
    android:layout_height="3dip" 
    android:layout_marginTop="60dip" 
    android:background="@color/com_facebook_blue" /> </FrameLayout> 

теперь установлен прогресс для FarmeLayout (т.е. идентификатор layout_rewards_progress_bar_view)