安卓版面设计答案

【问题标题】：Android layout design安卓版面设计
【发布时间】：2015-11-26 06:15:13
【问题描述】：

如果我在这里问一个愚蠢的问题，我很抱歉。

我正在寻找 android 布局设计。有没有一个方便我们设计android布局并最终生成xml代码到android studio的web。

我想要一个如下图的布局设计，但是我认为使用 android studio 布局是不可能的。

【问题讨论】：

你可以在 android studio 中设计这个布局
@Destro 我需要插入任何东西吗？我只是通过在屏幕上拖放调色板项目来学习自己......
没有插件用于设计此布局。这是为 layoute 设计的。
有可能。唯一令人困惑的是使用了9个补丁图像背景。
@Arslan 我在哪里可以获得rectangle textField ？

标签： android android-layout android-studio

【解决方案1】：

试试这个 xml 代码..

Screenshot

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

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/title1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/round_corner_up"
        android:padding="@dimen/value_10"
        android:text="Choose Station"
        android:textColor="@color/black"
        android:textSize="@dimen/txt_large" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/title1"
        android:layout_marginTop="-15dp"
        android:background="@drawable/round_corner_up">

        <EditText
            android:layout_width="350dp"
            android:layout_height="70dp"
            android:layout_margin="@dimen/value_10"
            android:background="@drawable/round_corner_square" />
    </LinearLayout>
</RelativeLayout>

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingTop="@dimen/value_10">

    <TextView
        android:id="@+id/title2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/round_corner_up"
        android:padding="@dimen/value_10"
        android:text="Within Next"
        android:textColor="@color/black"
        android:textSize="@dimen/txt_large" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/title2"
        android:layout_marginTop="-15dp"
        android:background="@drawable/round_corner_up">
  <Spinner
    android:layout_width="350dp"
    android:layout_height="70dp"></Spinner>

    </LinearLayout>
</RelativeLayout>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="@dimen/value_20"
    android:orientation="horizontal">
    <Button
        android:layout_width="0dp"
        android:layout_weight="1"
        android:text="Arrivals"
        android:textSize="20sp"
        android:drawableLeft="@drawable/drawable1"
        android:layout_height="@dimen/value_70" />
    <Button
        android:layout_width="0dp"
        android:layout_weight="1"
        android:text="Departures"
        android:textSize="20sp"
        android:drawableLeft="@drawable/drawable2"
        android:layout_height="@dimen/value_70" />
</LinearLayout>

round_corner_up.xml

<?xml version="1.0" encoding="utf-8"?><!--  res/drawable/rounded_edittext.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="10dp"
android:shape="rectangle">
<solid android:color="#7B7D7B" />
<stroke
    android:width="3dip"
    android:color="#7B7D7B" />
<corners
    android:bottomLeftRadius="10dp"
    android:bottomRightRadius="10dp"
    android:topLeftRadius="10dp"
    android:topRightRadius="10dp" />

round_corner_square.xml

<?xml version="1.0" encoding="utf-8"?><!--  res/drawable/rounded_edittext.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="10dp"
android:shape="rectangle">
<solid android:color="@color/white" />
<stroke
    android:width="3dip"
    android:color="@color/light_gray" />
<corners
    android:bottomLeftRadius="15dp"
    android:bottomRightRadius="15dp"
    android:topLeftRadius="15dp"
    android:topRightRadius="15dp" />

【讨论】：

非常感谢！！我可以知道您如何设置维度值吗？
用 dp 替换 dimen 值（例如，@dimen/value_10 用 10dp）
@seng use light_gray = #C2C8CE
谢谢 :D 你在哪里可以找到所有颜色的源代码？
@Seng 您可以对所有颜色代码使用安卓颜色选择器。

【解决方案2】：

您需要将布局划分为更小的元素。例如选择站将是一个 TextView，上面有背景图像和文本“选择站”。在其下方将有一个带有图像背景和一个 EditText 的 Relativelayout。将有一个带有放大镜作为背景可绘制的搜索按钮。这将与父级的右侧对齐，使其位于 Edittext 之上。

【讨论】：