2016-06-03 3 views
1

При проектировании калькулятора Кнопки в 5,7-дюймовом экране идеально подходят в 5,5-дюймовом экране, кнопки не подходят идеально. (Посмотрите изображение ниже). Каким может быть подходящий способ разработки для всех экранов MOBILE?Проектирование калькулятора для всех мобильных устройств

<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" 
android:background="#ff8800" 
tools:context=".MainActivity"> 


<TextView 
    android:id="@+id/textView" 
    android:layout_width="match_parent" 
    android:layout_height="200dp" 
    android:background="#ffffff" 
    android:padding="0dp" 
    android:text="New Text" 
    android:layout_alignParentTop="true" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="true" /> 

<Button 
    android:id="@+id/button" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="false" 
    android:layout_below="@+id/textView" 
    android:layout_margin="0dp" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button2" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_below="@+id/textView" 
    android:layout_toEndOf="@+id/button" 
    android:layout_toRightOf="@+id/button" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button3" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_below="@+id/textView" 
    android:layout_toEndOf="@+id/button2" 
    android:layout_toRightOf="@+id/button2" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button4" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="false" 
    android:layout_below="@+id/button" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button5" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_alignTop="@+id/button4" 
    android:layout_toLeftOf="@+id/button3" 
    android:layout_toStartOf="@+id/button3" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button6" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_below="@+id/button2" 
    android:layout_toEndOf="@+id/button2" 
    android:layout_toRightOf="@+id/button2" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button7" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="false" 
    android:layout_below="@+id/button4" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button8" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_alignTop="@+id/button7" 
    android:layout_toLeftOf="@+id/button6" 
    android:layout_toStartOf="@+id/button6" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button9" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_alignLeft="@+id/button6" 
    android:layout_alignStart="@+id/button6" 
    android:layout_below="@+id/button6" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button10" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="false" 
    android:layout_below="@+id/button7" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button11" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_below="@+id/button8" 
    android:layout_toLeftOf="@+id/button9" 
    android:layout_toStartOf="@+id/button9" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button12" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_alignLeft="@+id/button9" 
    android:layout_alignStart="@+id/button9" 
    android:layout_below="@+id/button9" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button13" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_below="@+id/textView" 
    android:layout_toEndOf="@+id/button3" 
    android:layout_toRightOf="@+id/button3" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button14" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_below="@+id/button13" 
    android:layout_toRightOf="@+id/button3" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button15" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_below="@+id/button14" 
    android:layout_toRightOf="@+id/button3" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 

<Button 
    android:id="@+id/button16" 
    android:layout_width="100dp" 
    android:layout_height="100dp" 
    android:layout_below="@+id/button15" 
    android:layout_toRightOf="@+id/button3" 
    android:background="#4a4a4a" 
    android:text="7" 
    android:textColor="#ffffff" 
    android:textSize="30dp" /> 
    </RelativeLayout> 

5.7 Inch Screen5.0 Inch Screen

+0

Почему вы не используете gridlayout или recyclerview с помощью gridlayoutmanager для кнопок? – Vektor88

+1

Остановить размеры виджетов жесткого кодирования. – CommonsWare

+0

@CommonsWare Yup Я знаю проблему. Но какое решение? –

ответ

1

Вы должны создать несколько макет в папку макета для поддержки нескольких экранов. Пример:

res/layout/my_layout.xml    // layout for normal screen size ("default") 
res/layout-large/my_layout.xml  // layout for large screen size 
res/layout-xlarge/my_layout.xml  // layout for extra-large screen size 
res/layout-xlarge-land/my_layout.xml // layout for extra-large in landscape 

Проверить official documentation для получения дополнительной информации.

3

Вы также должны рассмотреть возможность использования GridLayout или GridView, чтобы независимо от размера экрана ваши кнопки соответственно настраивались.

Этот парень сделал очень хороший учебник по реализации что-то близкое к тому, что вы хотите с помощью GridLayout: http://code.tutsplus.com/tutorials/android-user-interface-design-creating-a-numeric-keypad-with-gridlayout--mobile-8677

С GridLayout, вы просто решить, сколько строк, столбцы и ячеек есть, и они должны масштабироваться с другим экраном размеры.

Смежные вопросы