2012-12-05 5 views
0

그런 종류의 레이아웃을 설정하려고합니다 : 가로로 3 개의 이미지가 표시되고 그 이미지 아래에 다음 행의 숫자가 표시됩니다. 내가 그렇게 할 수있는 방법, 좋은 이미지를 표시하는, 나의 현재 XML 레이아웃의 여기 enter image description here 하지만 숫자는 바로 이미지 아래 있지 :android에서 레이아웃 만들기

여기에서 원하는 레이아웃입니까? 레이아웃 (새 프로젝트에 복사 한 레이아웃을 볼 수 있습니다) : http://pastebin.com/aYb8eeQn

답변

6

여기 있습니다.

android:weightSum="3" 인 가로 LinearLayout과 android:layout_weight="1" 인 각 자식을 사용했습니다. 자식 처리 된 너비가 android:layout_width="0dip"임을 유의하십시오.

두 번째 이미지는 다른 두 이미지보다 훨씬 큽니다.

enter image description here

<LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="100dip" 
     android:background="#333" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <LinearLayout 
      android:layout_width="0dip" 
      android:layout_height="fill_parent" 
      android:layout_margin="5dip" 
      android:layout_weight="1" 
      android:background="#fff" 
      android:gravity="center" 
      android:orientation="vertical" > 

      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dip" 
       android:layout_weight="1" 
       android:scaleType="centerInside" 
       android:src="@drawable/ic_launcher" /> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="1" /> 
     </LinearLayout> 

     <LinearLayout 
      android:layout_width="0dip" 
      android:layout_height="fill_parent" 
      android:layout_margin="5dip" 
      android:layout_weight="1" 
      android:background="#fff" 
      android:gravity="center" 
      android:orientation="vertical" > 

      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dip" 
       android:layout_weight="1" 
       android:scaleType="centerInside" 
       android:src="@drawable/wonders_of_zen" /> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="2" /> 
     </LinearLayout> 

     <LinearLayout 
      android:layout_width="0dip" 
      android:layout_height="fill_parent" 
      android:layout_margin="5dip" 
      android:layout_weight="1" 
      android:background="#fff" 
      android:gravity="center" 
      android:orientation="vertical" > 

      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dip" 
       android:layout_weight="1" 
       android:scaleType="centerInside" 
       android:src="@drawable/ic_launcher" /> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="3" /> 
     </LinearLayout> 
    </LinearLayout> 
+0

그림 크기에 영향을주지 않습니까? – idish

+0

@idish 이해가 안됩니다. 그림 크기에 어떤 영향을 미칩니 까? –

+0

오, 나는 이미지의 크기를 조정할 것이라고 생각했지만 scaleType = "centerInside"때문에 그렇지 않습니다. 대단히 고마워! – idish

0

을 당신은 하나의 큰 거대한 RelativeLayout의를 사용할 수있는 시간이 걸릴 수 있습니다. 두 가지 이미지를 보여 드리겠습니다. 더 많은 것을 위해 패턴을 계속 확장하십시오.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" > 

    <ImageButton 
     android:id="@+id/img1" 
     android:onClick="myClickHandler" 
     android:layout_marginLeft="5dp" 
     android:layout_width="48dp" 
     android:layout_height="48dp" 
     android:src="@drawable/emptystar" /> 
    <ImageButton 
     android:id="@+id/img2" 
     android:onClick="myClickHandler" 
     android:layout_marginLeft="5dp" 
     android:layout_width="48dp" 
     android:layout_height="48dp" 
     android:src="@drawable/emptystar" 
     android:layout_toLeftOf="@+id/img1" 
     android:alignParentRight="True"/> 
    <TextView 
     android:textStyle="bold" 
     android:text="1" 
     android:layout_toLeftOf="@id/img1" 
     android:textSize="48sp" 
     android:layout_marginLeft="5dp" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/img1" 
     android:layout_alignRight="@+id/img1" 
     android:layout_alignLeft="@+id/img1" 
     android:layout_alignParentBottom="true"/> 
    <TextView 
     android:textStyle="bold" 
     android:text="2" 
     android:textSize="48sp" 
     android:layout_marginLeft="5dp" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/img2" 
     android:layout_alignRight="@+id/img2" 
     android:layout_alignLeft="@+id/img2" 
     android:layout_alignParentBottom="true"/> 
</RelativeLayout 
1

단지 수평 LinearLayoutLinearLayout들에서 고르게 이격 설정. 이와 같은 것 (완료되지 않음, 개요 만) :

<LinearLayout 
    android:orientation="horizontal"> 
    <LinearLayout 
     android:layout_width="0" 
     android:layout_weight="1" 
     android:orientation="vertical"> 
     <ImageView /> <!-- first image --> 
     <TextView /> <!-- 1 --> 
    </LinearLayout> 
    <!-- Repeat the above LinearLayout as many times as you like --> 
</LinearLayout> 
0

것은

<LinearLayout android:layout_width="wc" ...height="wc" orientation="vertical"> 
//Here place your image view 
<ImageButton ..width="48dp" ..height="48dp" /> 

//Then place your text view 
<TextView ..width="match_parent" ..height="wc" ..gravity="center" /> 
</LinearLayout> 

상대 레이아웃이 레이아웃을 복제하고 적절한 위치를 제공, 그나마 걱정

먼저 당신의 필요에 따라 내부 레이아웃을 만들려면 다음과 같이하십시오. 그렇지 않으면 다음과 같이 중복 된 레이아웃을 다른 선형 레이아웃 (기본 방향)에 배치하십시오.

<LinearLayout ....> 
     <LinearLayout ...... orientation="vertical"> 
      <ImageButton ...... /> 
      <TextView ......... /> 
     </LinearLayout> 

     <LinearLayout ...... orientation="vertical"> 
      <ImageButton ...... /> 
      <TextView ......... /> 
     </LinearLayout> 

     <LinearLayout ...... orientation="vertical"> 
      <ImageButton ...... /> 
      <TextView ......... /> 
     </LinearLayout> 


</LinearLayout> 
관련 문제