在 xml 中并排显示 DatePicker 和 TimePicker

Question

Android Studio 0.6.0
minSdkVersion 10
targetSdkVersion 19

你好，

<DatePicker
    android:id="@+id/datePicker"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:calendarViewShown="false"
    android:scaleX="0.5"
    android:scaleY="0.5"
    android:layout_alignParentLeft="true"/>

<TimePicker
    android:id="@+id/timePicker"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:scaleX="0.5"
    android:scaleY="0.5"
    android:layout_alignParentRight="true"
    android:layout_alignBaseline="@id/datePicker"/>
</LinearLayout>

我有以下包含 DatePicker 和 TimePicker 的 xml。但是，当我在设备上进行测试时，它们太大而无法并排放置。

我尝试过调整权重并尝试使宽度和高度更小，但它仍然看起来不正确。

非常感谢您的任何建议，

Answer 1

我试过你的问题，发现this link。尽管缩放减小了选择器的大小（我尝试了 0.5），但我无法将两个视图放在同一布局上。这是由于各个选择器中的填充而发生的。这是示例 xml：

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

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:orientation="vertical" >

    <DatePicker
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:calendarViewShown="false"
        android:scaleX="0.5"
        android:scaleY="0.5" >
    </DatePicker>
</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:orientation="vertical" >

    <TimePicker
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleX="0.5"
        android:scaleY="0.5" >
    </TimePicker>
</LinearLayout>

Answer 2

尝试使用以下嵌套布局来实现您想要的视觉显示。 请注意，如果您不喜欢日期和时间的可滚动视图，显示的 EditText 布局只是一种替代方法。

日期和时间选择器的填充、高度和宽度等属性是固定的，因此不能仅在 XML 中进行修改。缩放它们会使它们看起来很奇怪。

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:paddingTop="20dp" >

    <HorizontalScrollView
        android:id="@+id/dateScrollView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="0.5" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal" >

            <DatePicker
                android:id="@+id/datePicker"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="0.5" />
        </LinearLayout>
    </HorizontalScrollView>

    <HorizontalScrollView
        android:id="@+id/timeScrollView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="0.5" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal" >

            <TimePicker
                android:id="@+id/timePicker1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="0.5" />
        </LinearLayout>
    </HorizontalScrollView>
</LinearLayout>

<TextView
    android:id="@+id/dateTimeInstructions"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="20dp"
    android:text="Swipe across Date and Time widgets above to see hidden parts as needed"
    android:textAppearance="?android:attr/textAppearanceSmall" />

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:paddingTop="30dp" >

    <EditText
        android:id="@+id/dateInput"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:ems="10"
        android:hint="Enter Date here"
        android:inputType="date" />

    <EditText
        android:id="@+id/timeInput"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:ems="10"
        android:hint="Enter Time here"
        android:inputType="time" />
</LinearLayout>

Answer 3

在您的布局上执行以下操作：

1. (a) 将根布局从 LinearLayout 更改为 RelativeLayout。

1. (b) 在“选择器”布局上设置以下属性：

日期选择器： android:layout_alignParentRight="true"

时间选择器： android:layout_alignParentLeft="true"

您可以按任意顺序为两个选择器交换属性。

2.为您的每个布局指定一个 ID 以供参考。

3. 在其中任何一个上，设置以下属性：android:layout_alignBaseline="@+id/OTHER_LAYOUT_ID"，例如假设您为 DatePicker 布局提供了 ID 'datepicker'，您可以将 TimePicker 上的 'alignBaseline' 属性设置为;

android:layout_alignBaseline="@+id/datepicker"

这将使两个布局在同一行上水平对齐。

注意：这些属性最适合按钮等元素和其他较小的表单字段。