web-dev-qa-db-fra.com

Android, comment définir une vue d'image avec un pourcentage dans relativelayout

Je veux construire 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 ImageView comme "SHOP" dans le lien donc il y aura un total de 5 ImageViews , et j'ai défini l'ID comme ils l'ont nommé 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="@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="@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="@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="@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="@drawable/e" />
</RelativeLayout>
androidimageuser-interface
26
Kennett

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="@drawable/a" />
    <ImageView 
        Android:id="@+id/img_camera" 
        Android:layout_width="0dp" 
        Android:layout_height="match_parent"
        Android:layout_weight="1"
        Android:src="@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="@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="@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="@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="@drawable/e" />
32
Ethan

C'est difficile à faire en Xml, vous pouvez le faire en codant des 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);
 }
});
6
Sreejith B Naick