1. ホーム
  2. 質問と答え
  3. 5列のグリッドレイアウトを作成

5列のグリッドレイアウトを作成

2016-08-21 2 views
0

私はアンドロイドレイアウトの基本を理解しようとしています。それで、私は基本と科学の2つのビューを持つ計算機アプリケーションを作成することに決めました。5列のグリッドレイアウトを作成

だから、私は1つの以上の捕虜、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

答えて

0

まあ誰もが答えたように、私は自分自身でこれを解決していました。

問題は、ボタンのグリッドセル番号をハードコードしていましたが、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

関連する問題

 関連する問題