2014-09-05 4 views
0

나는 float: left CSS와 같은 효과를 얻을 흥미 롭군요. 지금 RelativeLayoutandroid:layout_toRightOf을 사용하고 있지만 적합하지 않을 때 다음 줄로 이동하는보기가 필요합니다. 안드로이드 레이아웃에서 이것을 달성하는 방법?플로트 안드로이드에서 포장과 함께 왼쪽

<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"> 

    <Button 
     android:id="@+id/a" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:width="300dp" /> 

    <Button 
     android:id="@+id/b" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_toRightOf="@+id/a" 
     android:width="300dp" /> 

    <Button 
     android:id="@+id/c" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_toRightOf="@+id/b" 
     android:width="300dp" /> 

</RelativeLayout> 

나는 내가 한 줄에 2 개 버튼에 있고 두 번째에서 세 번째 줄에 예를 들어 3 버튼을 를 얻기 위해 필요하지만, 작은 화면에 더 넓은 화면에서이 example

처럼 뭔가가 필요 선. 아래 이미지와 같습니다.

작은 장치 용 단일 행

smaller device

넓은 장치

wider device

+0

이미지로 시도한 것을 게시 하시겠습니까? – Aniruddha

+0

같은 줄에 단추를 넣으시겠습니까 ?? –

+0

번호. 한 줄에 들어 가지 않으면 단추를 다음 줄로 감싸 야합니다. – marioosh

답변

2

대신 RelativeLayout의 수평 방향을 가진 LinearLayout를 사용한다.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="horizontal"> 

<!-- add your views here --> 

</LinearLayout> 

여러 행의 경우 자동으로 요소를 줄 바꿈하기를 원합니다. 당신은 android flow-layout project를 살펴 또는 this custom implementation

/** Custom view which extends {@link RelativeLayout} 
* and which places its children horizontally, 
* flowing over to a new line whenever it runs out of width.*/ 
public class HorizontalFlowLayout 
    extends RelativeLayout 
{ 
    /** Constructor to use when creating View from code.*/ 
    public HorizontalFlowLayout(Context context) 
    { 
    super(context); 
    } 

    /** Constructor that is called when inflating View from XML.*/ 
    public HorizontalFlowLayout(Context context, AttributeSet attrs) 
    { 
    super(context, attrs); 
    } 

    /** Perform inflation from XML and apply a class-specific base style.*/ 
    public HorizontalFlowLayout(Context context, AttributeSet attrs, int defStyle) 
    { 
    super(context, attrs, defStyle); 
    } 

    @Override 
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) 
    { 
    // need to call super.onMeasure(...) otherwise get some funny behaviour 
    super.onMeasure(widthMeasureSpec, heightMeasureSpec); 

    final int width = MeasureSpec.getSize(widthMeasureSpec); 
    int height = MeasureSpec.getSize(heightMeasureSpec); 

    // increment the x position as we progress through a line 
    int xpos = getPaddingLeft(); 
    // increment the y position as we progress through the lines 
    int ypos = getPaddingTop(); 
    // the height of the current line 
    int line_height = 0; 

    // go through children 
    // to work out the height required for this view 

    // call to measure size of children not needed I think?! 
    // getting child's measured height/width seems to work okay without it 
    //measureChildren(widthMeasureSpec, heightMeasureSpec); 

    View child; 
    MarginLayoutParams childMarginLayoutParams; 
    int childWidth, childHeight, childMarginLeft, childMarginRight, childMarginTop, childMarginBottom; 

    for (int i = 0; i < getChildCount(); i++) 
    { 
     child = getChildAt(i); 

     if (child.getVisibility() != GONE) 
     { 
     childWidth = child.getMeasuredWidth(); 
     childHeight = child.getMeasuredHeight(); 

     if (child.getLayoutParams() != null 
      && child.getLayoutParams() instanceof MarginLayoutParams) 
     { 
      childMarginLayoutParams = (MarginLayoutParams)child.getLayoutParams(); 

      childMarginLeft = childMarginLayoutParams.leftMargin; 
      childMarginRight = childMarginLayoutParams.rightMargin; 
      childMarginTop = childMarginLayoutParams.topMargin; 
      childMarginBottom = childMarginLayoutParams.bottomMargin; 
     } 
     else 
     { 
      childMarginLeft = 0; 
      childMarginRight = 0; 
      childMarginTop = 0; 
      childMarginBottom = 0; 
     } 

     if (xpos + childMarginLeft + childWidth + childMarginRight + getPaddingRight() > width) 
     { 
      // this child will need to go on a new line 

      xpos = getPaddingLeft(); 
      ypos += line_height; 

      line_height = childMarginTop + childHeight + childMarginBottom; 
     } 
     else 
      // enough space for this child on the current line 
      line_height = Math.max(
       line_height, 
       childMarginTop + childHeight + childMarginBottom); 

     xpos += childMarginLeft + childWidth + childMarginRight; 
     } 
    } 

    ypos += line_height + getPaddingBottom(); 

    if (MeasureSpec.getMode(heightMeasureSpec) == MeasureSpec.UNSPECIFIED) 
     // set height as measured since there's no height restrictions 
     height = ypos; 
    else if (MeasureSpec.getMode(heightMeasureSpec) == MeasureSpec.AT_MOST 
     && ypos < height) 
     // set height as measured since it's less than the maximum allowed 
     height = ypos; 

    setMeasuredDimension(width, height); 
    } 

    @Override 
    protected void onLayout(boolean changed, int l, int t, int r, int b) 
    { 
    // increment the x position as we progress through a line 
    int xpos = getPaddingLeft(); 
    // increment the y position as we progress through the lines 
    int ypos = getPaddingTop(); 
    // the height of the current line 
    int line_height = 0; 

    View child; 
    MarginLayoutParams childMarginLayoutParams; 
    int childWidth, childHeight, childMarginLeft, childMarginRight, childMarginTop, childMarginBottom; 

    for (int i = 0; i < getChildCount(); i++) 
    { 
     child = getChildAt(i); 

     if (child.getVisibility() != GONE) 
     { 
     childWidth = child.getMeasuredWidth(); 
     childHeight = child.getMeasuredHeight(); 

     if (child.getLayoutParams() != null 
      && child.getLayoutParams() instanceof MarginLayoutParams) 
     { 
      childMarginLayoutParams = (MarginLayoutParams)child.getLayoutParams(); 

      childMarginLeft = childMarginLayoutParams.leftMargin; 
      childMarginRight = childMarginLayoutParams.rightMargin; 
      childMarginTop = childMarginLayoutParams.topMargin; 
      childMarginBottom = childMarginLayoutParams.bottomMargin; 
     } 
     else 
     { 
      childMarginLeft = 0; 
      childMarginRight = 0; 
      childMarginTop = 0; 
      childMarginBottom = 0; 
     } 

     if (xpos + childMarginLeft + childWidth + childMarginRight + getPaddingRight() > r - l) 
     { 
      // this child will need to go on a new line 

      xpos = getPaddingLeft(); 
      ypos += line_height; 

      line_height = childHeight + childMarginTop + childMarginBottom; 
     } 
     else 
      // enough space for this child on the current line 
      line_height = Math.max(
       line_height, 
       childMarginTop + childHeight + childMarginBottom); 

     child.layout(
      xpos + childMarginLeft, 
      ypos + childMarginTop, 
      xpos + childMarginLeft + childWidth, 
      ypos + childMarginTop + childHeight); 

     xpos += childMarginLeft + childWidth + childMarginRight; 
     } 
    } 
    } 
} 
+0

버튼이 고정 폭 (예 : 300dp)을 가지면 더 작은 장치에 맞지 않고 "보이지 않음"입니다. 나는 뭔가 다른 것을 필요로한다. – marioosh

+0

나는 내 대답을 업데이트했습니다 – Nachi

0

사용하는 화면 크기 장치 1 개 라인에 세 개의 버튼을 MEK이 코드에 따라 자신을 구현하기 위해 시도 할 수 있습니다.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="horizontal" 
    android:weightSum="3" > 

    <Button 
     android:layout_width="0dp" 
     android:layout_weight="1" 
     android:layout_height="wrap_content"/> 
    <Button 
     android:layout_width="0dp" 
     android:layout_weight="1" 
     android:layout_height="wrap_content"/> 
    <Button 
     android:layout_width="0dp" 
     android:layout_weight="1" 
     android:layout_height="wrap_content"/> 
</LinearLayout> 
+0

버튼이 고정 너비를 가지며 적합하지 않은 경우 다음 줄로 동적으로 줄 바꿈을 원합니다. 귀하의 예에서는 한 줄에 3 개의 버튼이 ** 항상 ** – marioosh

+0

버튼 수는 동적입니까 고정되어 있습니까 ?? –

+0

동적 인 것이 더 좋지만, 지금은 고정 될 수 있습니다 (예 : 3 개의 버튼 (고정 너비 사용)). – marioosh

관련 문제