2013-07-05 21 views
22

Tôi muốn tạo giao diện người dùng như thế này http://postimg.org/image/fihidv1rv/. Đây là mã xml của tôi cho nó, cho thiết kế của tôi, tôi muốn "HIỆU QUẢ" & "CAMERA" để kết hợp như một ImageView như "Cửa hàng" trong liên kết như vậy sẽ có tổng cộng 5 ImageView s, và tôi đặt id như họ đã đặt tên trong liên kếtAndroid, cách đặt số lần xem hình ảnh với phần trăm trong relativelayout

vấn đề là, làm cách nào tôi có thể đặt chiều cao và chiều rộng bằng phần trăm?

hiệu lực + camrea: chiều cao 25%, chiều rộng 100%

cắt dán: chiều cao 25%, chiều rộng 50%

bốc thăm: chiều cao 25%, chiều rộng 50%

ảnh: chiều cao 50% , chiều rộng 50%

cửa hàng: chiều cao 25%, chiều rộng 100%

cảm ơn bạn rất nhiều: '(

<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

bạn phải sử dụng cách bố trí cân – Sandy09

+0

xin vui lòng kiểm tra câu hỏi của bạn. Tổng chiều cao lên đến 125%. Sẽ cắt dán, vẽ và hình ảnh trên cùng một hàng? Tổng tỷ lệ là 150%. – Ethan

+0

đó không thực sự là 125% và 150%, vì chúng được sắp xếp theo thứ tự đặc biệt, nó hiển thị trong liên kết này http://postimg.org/image/fihidv1rv/ – Kennett

Trả lời

27

Bạn có thể xem xét sử dụng android: layout_weight param trong cách bố trí 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

nó hoạt động !! tôi có thể hỏi một câu hỏi khác không? ví dụ: số lần xem ảnh của tôi là 10X10, nhưng hình ảnh của tôi là 10X20, thiết bị Android sẽ hiển thị hình ảnh là 5X10 để đảm bảo hình ảnh hiển thị tốt. làm thế nào tôi có thể thiết lập nó là kích thước hình ảnh ban đầu nhưng chỉ bỏ qua các phần quá nhiều? có thể hơi phức tạp, hy vọng bạn sẽ hiểu được :) – Kennett

+2

Bạn nên xem android: scaleType param trong ImageView - http://developer.android.com/reference/android/widget/ImageView.ScaleType.html. Chơi với tất cả các tùy chọn có sẵn và chọn những gì phù hợp nhất với bạn. Và bạn luôn có một tùy chọn khác: cắt hình ảnh của bạn trước khi chuyển sang ImageView. – Ethan

+0

cảm ơn rất nhiều !!bạn đã lưu ngày của bạn tôi – A7madev

6

Thật khó để nó trong Xml, bạn có thể làm điều đó bởi mã làm một số tính toán. Cách thực hiện:

  • Nhận chiều cao chính Chiều cao nội dung &, là chế độ xem gốc của bạn.
  • GetLayoutparams của mỗi IMAGExem, và thiết lập chiều cao & chiều rộng, bằng cách tính toán chiều cao tỷ lệ & rộng

Sample Code: (trong hoạt động)

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

Hãy cẩn thận với điều này: nếu bạn đặt mã này trong phương thức onCreate, parentView.getHeight() và .getWidth() sẽ trả về 0, vì các khung nhìn chưa được vẽ. – chteuchteu

+1

nơi nó sẽ được thêm vào? –

+1

Tốt hơn để gọi bằng phương thức 'View.post (Runnable)', có nghĩa là 'runnable' sẽ được gọi khi khung nhìn được vẽ trên màn hình. Ví dụ trên đã được cập nhật. – vakman

Các vấn đề liên quan