Android, comment définir imageview avec pourcentage in relativelayout - Android, image, interface utilisateur

Je veux créer une interface utilisateur comme celle-ci http://postimg.cc/image/fihidv1rv/ . Voici mon code xml pour cela, pour ma conception, je veux que "EFFECT" & "CAMERA" se combinent comme un seul ImageView comme "SHOP" dans le lien il y aura donc un total de 5 ImageViews, et j'ai défini l'ID comme ils le nomment dans le lien

le problème est, comment puis-je définir la hauteur et la largeur avec un pourcentage?

effet + camrea: hauteur 25%, largeur 100%

collage: hauteur 25%, largeur 50%

tirage: hauteur 25%, largeur 50%

photo: hauteur 50%, largeur 50%

boutique: hauteur 25%, largeur 100%

<RelativeLayout android:id="@+id/mainContent" android:layout_width="fill_parent" android:layout_height="fill_parent"
android:orientation="horizontal" android:background="#ffffff">
<ImageView
android:id="@+id/img_effect+camera"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="/images/@drawable/a" />
<ImageView
android:id="@+id/img_collage"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@+id/img_effect+camera"
android:src="/images/@drawable/b" />
<ImageView
android:id="@+id/img_draw"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="@+id/img_effect+camera"
android:layout_toRightOf="@+id/img_collage"
android:src="/images/@drawable/c" />
<ImageView
android:id="@+id/img_photo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="@+id/img_collage"
android:layout_below="@+id/img_draw"
android:src="/images/@drawable/d" />
<ImageView
android:id="@+id/img_shop"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@+id/img_photo"
android:src="/images/@drawable/e" />
</RelativeLayout>

Réponses:

Vous pouvez envisager d'utiliser android: layout_weight param dans la mise en page http://developer.android.com/reference/android/widget/LinearLayout.LayoutParams.html#attr_android:layout_weight

<LinearLayout android:id="@+id/mainContent" android:layout_width="match_parent" android:layout_height="match_parent"
android:orientation="vertical" android:background="#ffffff">
<!-- height 25% -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">

<ImageView
android:id="@+id/img_effect"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:src="/images/@drawable/a" />
<ImageView
android:id="@+id/img_camera"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:src="/images/@drawable/a" />
</LinearLayout>

<!-- height 50% -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:orientation="horizontal">

<!-- width 50% -->

<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">

<!-- height 50%% -->
<ImageView
android:id="@+id/img_collage"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:src="/images/@drawable/a" />

<!-- height 50%% -->
<ImageView
android:id="@+id/img_draw"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:src="/images/@drawable/a" />
</LinearLayout>

<!-- width 50% -->
<ImageView
android:id="@+id/img_photo"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:src="/images/@drawable/b" />
</LinearLayout>
<!-- height 25%% -->
<ImageView
android:id="@+id/img_shop"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:src="/images/@drawable/e" />

C'est difficile à faire en Xml, vous pouvez le faire en codant quelques calculs. Comment faire:

• Obtenez la hauteur et la largeur du contenu principal, qui est votre vue parent.
• GetLayoutparams de chaque imageVIew, et définissez la hauteur et la largeur, en calculant le pourcentage hauteur et largeur

Exemple de code: (en activité)

final View parentView= findViewById(R.id.mainContent);
final ImageView effect_camera= (ImageView)findViewById(R.id.img_effect+camera);

effect_camera.post(new Runnable(){
@Override
public void run(){
int height=parentView.getHeight();
int width=parentView.getWidth();


RelativeLayout.LayoutParams lp= (RelativeLayout.LayoutParams)effect_camera.getLayoutParams();
int percentHeight=height*.25;
int percentWidth= width*1;
lp.height=percentHeight;
lp.width=percentWidth;
effect_camera.setLayoutParams(lp);
}
});