Android Studio中的布局帮助

时间:2015-02-11 21:35:49

标签: android android-layout

我是一名大学生,刚刚开始学习如何使用Android进行编程,而且我正在使用Android Studio。我是一个相对较新的人,但对于迄今为止有些事情是如何工作的,我们理解这个非常非常一般的想法。我的任务是设计一个小费计算器应用程序,有三个文本字段供用户输入:总帐单,小费百分比和拆分字段,如果用户想要在不同的人之间平均分摊支票,默认情况下分裂只是一个人。仅指定了应用程序的功能,而不是布局或美学。

我非常了解我希望我的应用看起来的方式。我希望我的三个输入框最左边对齐,直接在彼此的顶部,并显示在输入三个字段后自动显示的屏幕最底部的每人总金额,默认值为总帐单和提示百分比为0,默认拆分为1.

到目前为止,我无法将每个输入字段与最左侧对齐。我的第一个字段从左边开始,然后默认情况下下一个字段直接从右边开始。我无法弄清楚如何将它们叠加在另一个之上。在设计选项卡下,我可以将一个字段放在另一个字段下面,但是尝试向左移动一个字段会将另一个字段向右移动,反之亦然。我必须更改活动的xml文件中的哪种语法才能让它们在另一个上面对齐?我一直在寻找一些关于布局的教程网站,但他们并没有完全解释如何实现我的具体想法。我该怎么做?

我很感激帮助

修改:类似这样的内容

enter image description here

3 个答案:

答案 0 :(得分:0)

听起来很简单。我对Android Studio很陌生,但看看LinearLayout(垂直)。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal">

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/editText"
            android:text="split between"/>

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/editText2"
            android:text="a tip?"/>

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/editText3"
            android:text="total"/>
    </LinearLayout>
</LinearLayout>

答案 1 :(得分:0)

尝试这个建议:

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

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

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Total bill : $"
            android:id="@+id/totalBillTv"
            android:layout_gravity="center_vertical"
            android:layout_marginLeft="15dp"
            android:textColor="#000000" />

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/totalBillEdt"
            android:text="100"
            android:layout_marginLeft="9dp"
            android:layout_gravity="center_vertical"
            android:background="#ffffff" />
    </LinearLayout>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="21dp">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Tip % :"
            android:id="@+id/tipTv"
            android:layout_gravity="center_vertical"
            android:layout_marginLeft="15dp"
            android:textColor="#000000" />

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/tipEdt"
            android:text="15"
            android:layout_marginLeft="9dp"
            android:layout_gravity="center_vertical"
            android:background="#ffffff" />
        </LinearLayout>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="21dp">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Split "
            android:id="@+id/splitTv"
            android:layout_gravity="center_vertical"
            android:layout_marginLeft="15dp"
            android:textColor="#000000" />

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/splitEdt"
            android:text="2"
            android:layout_marginLeft="9dp"
            android:layout_gravity="center_vertical"
            android:background="#ffffff" />
        </LinearLayout>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="21dp">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Total :"
            android:id="@+id/totalTv"
            android:layout_gravity="center_vertical"
            android:layout_marginLeft="15dp"
            android:textColor="#000000" />

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/totalEdt"
            android:text="57.50"
            android:layout_marginLeft="9dp"
            android:layout_gravity="center_vertical"
            android:background="#ffffff" />
        </LinearLayout>
</LinearLayout>

PS:您可以使用android:textSize="YOUR_VALUE"来更改文字大小

答案 2 :(得分:0)

你可以这样做:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp"
        android:id="@+id/first_layout"
        android:layout_marginLeft="14dp">

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/total_bill"
            android:layout_toRightOf="@+id/total_bill_label"
            android:layout_marginLeft="9dp"
            android:minWidth="90dp"
            android:layout_centerVertical="true" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text="Total bill: $"
            android:id="@+id/total_bill_label"
            android:layout_centerVertical="true" />
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp"
        android:id="@+id/second_layout"
        android:layout_below="@+id/first_layout"
        android:layout_marginLeft="14dp">

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/tip"
            android:layout_toRightOf="@+id/tip_label"
            android:layout_marginLeft="9dp"
            android:minWidth="90dp"
            android:layout_centerVertical="true" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text="Tip: %"
            android:id="@+id/tip_label"
            android:layout_centerVertical="true" />
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp"
        android:id="@+id/third_layout"
        android:layout_below="@+id/second_layout"
        android:layout_marginLeft="14dp">

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/split"
            android:layout_toRightOf="@+id/split_label"
            android:layout_marginLeft="9dp"
            android:minWidth="40dp"
            android:layout_centerVertical="true" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text="Split:"
            android:id="@+id/split_label"
            android:layout_centerVertical="true" />
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp"
        android:id="@+id/fourth_layout"
        android:layout_below="@+id/third_layout"
        android:layout_marginLeft="14dp" >

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/total"
            android:layout_toRightOf="@+id/total_label"
            android:layout_marginLeft="9dp"
            android:minWidth="90dp"
            android:layout_centerVertical="true" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text="Total:"
            android:id="@+id/total_label"
            android:layout_centerVertical="true" />
    </RelativeLayout>

</RelativeLayout>

如果您想了解我所使用的布局的更多信息,请参阅以下简要说明:

我已将每个标签和相关的EditText放在相对布局中,以便能够对齐它们的垂直中心。你可以看到

android:layout_centerVertical="true"

android:layout_toRightOf="@+id/total_bill_label"

在第一个布局中。

之后我在相对布局中使用了alignComponent来对齐布局。

这是布局的预览:

Preview of the above layout