5 열로 격자 레이아웃 만들기

저는 Android 레이아웃의 기본 사항을 이해하려고합니다. 그래서 그것 때문에, 저는 기본과 과학이라는 2 가지 뷰를 가진 계산기 앱을 만들기로 결정했습니다.5 열로 격자 레이아웃 만들기

그래서, 나는 또 하나의 펑, SQRT, LN 같은 조작으로 행 등

와 과학 레이아웃을 만들려고 이제 기본 레이아웃을 생성하고 완료 그리고 기존에 새 열을 추가하는 동안 문제에 직면 레이아웃 : 새 버튼을 추가하려고하면 화면을 벗어납니다.

그래서, 질문 : 하드 코드 버튼의 너비없이 5 열로 그리드 레이아웃을 만드는 방법은 무엇입니까?

내 코드 :

<?xml version="1.0" encoding="utf-8"?> 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    xmlns:grid="http://schemas.android.com/apk/res-auto" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:weightSum="100" 
    tools:context="android.calcandroid.MainActivity"> 

    <include 
     android:id="@+id/tool_bar" 
     layout="@layout/tool_bar" 
     ></include> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="20"> 

     <TextView 
      android:layout_height="match_parent" 
      android:layout_width="match_parent" 
      android:text="0" 
      android:gravity="bottom|end" 
      android:singleLine="true" 
      android:textAppearance="@style/TextAppearance.AppCompat.Headline" 
      android:textSize="48sp" 
      android:background="#e3e7ea" 
      android:paddingBottom="32dp" 
      android:padding="16dp"/> 

    </LinearLayout> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="80"> 

     <android.support.v7.widget.GridLayout 
      android:id="@+id/gridLayout" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      grid:useDefaultMargins="false" 
      grid:alignmentMode="alignBounds" 
      grid:columnCount="7" 
      grid:rowCount="9"> 

      <!-- Row 1 --> 
      <Button 
       android:text="C" 
       android:background="@drawable/shape" 
       grid:layout_row="0" 
       grid:layout_column="0" 
       style="@style/calcAction" 
       android:textStyle="bold" 
       android:textColor="@color/calcAccent" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <ImageButton 
       android:background="@drawable/shape" 
       android:src="@android:drawable/ic_input_delete" 
       grid:layout_row="0" 
       grid:layout_column="2" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" /> 

      <Button 
       android:background="@drawable/shape" 
       android:text="&#247;" 
       grid:layout_row="0" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       grid:layout_column="4"/> 

      <Button 
       android:background="@drawable/shape" 
       android:text="x" 
       grid:layout_row="0" 
       grid:layout_column="6" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       style="@style/calcAction"/> 

      <!-- Row 2 --> 
      <View 
       grid:layout_gravity="fill_horizontal" 
       android:layout_height="1dp" 
       grid:layout_row="1" 
       grid:layout_column="0" 
       grid:layout_columnSpan="7" 
       android:background="#eee"/> 

      <Button 
       android:background="@drawable/shape" 
       android:text="7" 
       grid:layout_row="2" 
       grid:layout_column="0" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       style="@style/calcNumber"/> 

      <Button 
       android:background="@drawable/shape" 
       android:text="8" 
       grid:layout_row="2" 
       grid:layout_column="2" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:background="@drawable/shape" 
       android:text="9" 
       grid:layout_row="2" 
       grid:layout_column="4" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:background="@drawable/shape" 
       android:text="-" 
       grid:layout_row="2" 
       grid:layout_column="6" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <!-- Row 3 --> 

      <View 
       grid:layout_gravity="fill_horizontal" 
       android:layout_height="1dp" 
       grid:layout_row="3" 
       grid:layout_column="0" 
       grid:layout_columnSpan="7" 
       android:background="#eee"/> 

      <Button 
       android:background="@drawable/shape" 
       android:text="4" 
       grid:layout_row="4" 
       grid:layout_column="0" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:background="@drawable/shape" 
       android:text="5" 
       grid:layout_row="4" 
       grid:layout_column="2" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:background="@drawable/shape" 
       android:text="6" 
       grid:layout_row="4" 
       grid:layout_column="4" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:background="@drawable/shape" 
       android:text="+" 
       grid:layout_row="4" 
       grid:layout_column="6" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <View 
       grid:layout_gravity="fill_horizontal" 
       android:layout_height="1dp" 
       grid:layout_row="7" 
       grid:layout_column="0" 
       grid:layout_columnSpan="7" 
       android:background="#eee"/> 

      <!-- Row 4 --> 

      <Button 
       android:background="@drawable/shape" 
       android:text="1" 
       grid:layout_row="6" 
       grid:layout_column="0" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:background="@drawable/shape" 
       android:text="2" 
       grid:layout_row="6" 
       grid:layout_column="2" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:background="@drawable/shape" 
       grid:layout_row="6" 
       grid:layout_column="4" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       android:text="3" 
       style="@style/calcNumber"/> 

      <Button 
       grid:layout_row="6" 
       grid:layout_column="6" 
       grid:layout_rowSpan="3" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       android:background="@color/calcAccent" 
       android:textAppearance="@style/TextAppearance.AppCompat.Large" 
       android:textColor="@color/primary_material_light" 
       android:textStyle="bold" 
       android:textSize="22sp" 
       android:gravity="center_vertical|center_horizontal" 
       android:padding="8dp" 
       android:text="=" 
       style="@style/calcNumber"/> 
      <!-- Row 5 --> 

      <Button 
       android:background="@drawable/shape" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       grid:layout_row="8" 
       grid:layout_column="0" 
       grid:layout_columnSpan="3" 
       style="@style/calcNumber" 
       android:text="0"/> 

      <Button 
       android:background="@drawable/shape" 
       grid:layout_row="8" 
       grid:layout_column="4" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       style="@style/calcNumber" 
       android:text="."/> 

      <!-- Horizontal Grid --> 
      <View 
       grid:layout_gravity="fill_horizontal" 
       android:layout_height="1dp" 
       grid:layout_row="5" grid:layout_column="0" grid:layout_columnSpan="7" 
       android:background="#eee"/> 


     </android.support.v7.widget.GridLayout> 

    </LinearLayout> 

</LinearLayout>

그리고 4 열이 어떻게 보이는지 : 4 columns

출처

2016-08-21 likeanowl

잘 아무도 대답으로, 나 자신에 의해이 문제를 해결했다.

문제는 단추의 격자 셀 번호를 하드 코드하고 grid : layout_columnWeight & grid : layout_rowWeight를 완전히 이해하지 못했습니다.

그래서 나는 하드 코딩 된 값을 제거하고 여기에 솔루션의 전체 코드입니다 :

<?xml version="1.0" encoding="utf-8"?> 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    xmlns:grid="http://schemas.android.com/apk/res-auto" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:weightSum="100" 
    tools:context="android.calcandroid.MainActivity"> 

    <include 
     android:id="@+id/tool_bar" 
     layout="@layout/tool_bar" 
     ></include> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="20"> 

     <TextView 
      android:layout_height="match_parent" 
      android:layout_width="match_parent" 
      android:text="0" 
      android:gravity="bottom|end" 
      android:singleLine="true" 
      android:textAppearance="@style/TextAppearance.AppCompat.Headline" 
      android:textSize="48sp" 
      android:background="#e3e7ea" 
      android:paddingBottom="32dp" 
      android:padding="16dp"/> 

    </LinearLayout> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="80"> 

     <android.support.v7.widget.GridLayout 
      android:id="@+id/gridLayout" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      grid:useDefaultMargins="false" 
      grid:alignmentMode="alignBounds" 
      grid:columnCount="5" 
      grid:rowCount="5"> 

      <!-- Row 1 --> 
      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="ln" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       style="@style/calcAction"/> 

      <Button 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:text="C" 
       android:background="@drawable/shape" 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       style="@style/calcAction" 
       android:textStyle="bold" 
       android:textColor="@color/calcAccent" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <ImageButton 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:src="@android:drawable/ic_input_delete" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" /> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="&#247;" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="x" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       style="@style/calcAction"/> 

      <!-- Row 2 --> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="log" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="7" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       style="@style/calcNumber"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="8" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="9" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="-" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <!-- Row 3 --> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="\u221A" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="4" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="5" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="6" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="+" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <!-- Row 4 --> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="^" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="1" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="2" 
       style="@style/calcNumber" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       android:text="3" 
       style="@style/calcNumber"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_vertical" 
       grid:layout_rowSpan="2" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       android:background="@color/calcAccent" 
       android:textAppearance="@style/TextAppearance.AppCompat.Large" 
       android:textColor="@color/primary_material_light" 
       android:textStyle="bold" 
       android:textSize="22sp" 
       android:gravity="center_vertical|center_horizontal" 
       android:padding="8dp" 
       android:text="=" 
       style="@style/calcNumber"/> 

      <!-- Row 5 --> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       android:text="!" 
       style="@style/calcAction" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       grid:layout_columnSpan="2" 
       style="@style/calcNumber" 
       android:text="0"/> 

      <Button 
       android:layout_width="0dp" 
       android:layout_height="0dp" 
       grid:layout_gravity="fill_horizontal" 
       android:gravity="center" 
       android:background="@drawable/shape" 
       grid:layout_columnWeight="1" 
       grid:layout_rowWeight="1" 
       style="@style/calcNumber" 
       android:text="."/> 

     </android.support.v7.widget.GridLayout> 

    </LinearLayout> 

</LinearLayout>

그리고 스크린 샷이 대답은 사람을 도움이 될 것으로 pretty nice!

희망.

출처

2016-08-21 23:00:32 likeanowl

답변

관련 문제