2013-07-05 2 views
22

Я хочу построить UI вот так http://postimg.org/image/fihidv1rv/. Вот мой XML-код для этого, для моего дизайна, я хочу «ЭФФЕКТ» & «CAMERA», чтобы объединить в один ImageView как «магазин» в ссылке так будет всего 5 ImageView s, и я установить идентификатор как они указаны в ссылкеAndroid, как установить изображение с процентом в relativelayout

проблема в том, как я могу установить высоту и ширину в процентах?

эффект + camrea: высота 25%, ширина 100%

коллаж: высота 25%, ширина 50%

дро: высота 25%, ширина 50%

фото: высота 50% , ширина 50%

магазин: высота 25%, ширина 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> 
+0

вы должны использовать вес макета – Sandy09

+0

пожалуйста, проверьте ваш вопрос. Общая высота составляет до 125%. Будет ли коллаж, рисовать и фото в том же ряду? Общий процент составляет 150%. – Ethan

+0

Это не действительно 125% и 150%, так как они устраиваются в специальном порядке, это видно по этой ссылке http://postimg.org/image/fihidv1rv/ – Kennett

ответ

27

Вы можете рассмотреть возможность использования андроида: layout_weight параметров в макете 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" /> 

+1

это работает !! могу я задать другой вопрос? например, мое изображение - 10X10, но мое изображение - 10X20, устройство Android отобразит изображение как 5X10, чтобы убедиться, что изображение хорошо отображено. как я могу установить его как исходный размер изображения, а просто игнорировать слишком много частей? может быть, немного сложно, надеюсь, вы поймете :) – Kennett

+2

Вы должны посмотреть на android: scaleType param в ImageView - http://developer.android.com/reference/android/widget/ImageView.ScaleType.html. Играйте со всеми доступными опциями и выберите, какая работа лучше всего подходит для вас. И у вас всегда есть другой вариант: обрезать изображение перед тем, как перейти к ImageView. – Ethan

+0

спасибо большое!вы спасли день моего друга – A7madev

6

его трудно ему в Xml, вы можете сделать это с помощью кода делает некоторые вычисления. Как сделать:

  • Получить MainContent высота & ширину, которая является вашим родителем вид.
  • GetLayoutparams каждого ImageView и установить высоту & ширину, вычисляя высоту в процентах & ширина

Пример кода: (в деятельности)

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); 
} 
}); 
+4

Будьте осторожны с этим: если вы поместите этот код в метод onCreate, parentView.getHeight() и .getWidth() вернут 0, так как представления еще не нарисованы. – chteuchteu

+1

где его следует добавить? –

+1

Его лучше вызвать с помощью метода «View.post (Runnable)», что означает, что «runnable» вызывается, когда представление отображается на экране. Выше, например, обновлено. – vakman

Смежные вопросы