4

私はRelativeLayoutを使用するときの「toLeftOf」と「toRightOf」の問題の解決策を探していましたが、この動作に対する実際の解決策または適切な答えが見つかりませんでした。

基本的に、「toLeftOf」はあまりうまく機能していません。

EditTextが2つあり、各EditTextの左側に画像を表示したいと思います。これを実行しようとすると、次の結果が得られます（Eclipseエディター）。

ここに画像の説明を入力してください

ご覧のとおり、画像はまったく表示されていません。使用されるXMLは次のとおりです。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="30dp"
    android:layout_marginRight="30dp"
    android:layout_marginTop="35dp"
    android:background="#010101"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <EditText
        android:id="@+id/login_carNumber"
        style="@style/EditTextDark"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="@string/prompt_carNumber"
        android:inputType="phone"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textCursorDrawable="@null" >

        <requestFocus />
    </EditText>

    <ImageView
        android:id="@+id/login_car_icon"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/user"
        android:layout_toLeftOf="@id/login_carNumber" />

    <EditText
        android:id="@+id/login_password"
        style="@style/EditTextDark"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/login_carNumber"
        android:layout_marginTop="10dp"
        android:hint="@string/prompt_password"
        android:inputType="phone"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textCursorDrawable="@null" >
    </EditText>

    <ImageView
        android:id="@+id/login_lock_icon"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/lock"
        android:layout_toLeftOf="@id/login_password" />

</RelativeLayout>

まず、なぜこれが機能しないのですか？

XMLを変更し、画像で「toLeftOf」の代わりにEditTextsで「toRightOf」を使用すると、次の結果が得られます。

ここに画像の説明を入力してください

ご覧のとおり、両方の画像が表示されていますが、南京錠が2番目のEditTextの左側にあるはずの場合、これらは「互いに重なり合っています」。XMLは次のとおりです。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="30dp"
    android:layout_marginRight="30dp"
    android:layout_marginTop="35dp"
    android:background="#010101"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <EditText
        android:id="@+id/login_carNumber"
        style="@style/EditTextDark"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/login_car_icon"
        android:hint="@string/prompt_carNumber"
        android:inputType="phone"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textCursorDrawable="@null" >

        <requestFocus />
    </EditText>

    <ImageView
        android:id="@+id/login_car_icon"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/user" />

    <EditText
        android:id="@+id/login_password"
        style="@style/EditTextDark"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/login_carNumber"
        android:layout_marginTop="10dp"
        android:layout_toRightOf="@+id/login_lock_icon"
        
        android:hint="@string/prompt_password"
        android:inputType="phone"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textCursorDrawable="@null" >
    </EditText>

    <ImageView
        android:id="@+id/login_lock_icon"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/lock" 
        />

</RelativeLayout>

2番目の質問; 2番目のEditTextのすぐ左ではなく、最初の画像の上に「南京錠」の画像があるのはなぜですか。

最後のImageView（南京錠の画像）に次の行を追加すると、次のようになります。

android:layout_below="@+id/login_car_icon"

正しく配置されていますが、「ハック」である必要はないと思いますよね？

したがって、最後のImageViewには次のXMLが機能します。

<ImageView
    android:id="@+id/login_lock_icon"
    android:layout_width="40dp"
    android:layout_height="40dp"
    android:src="@drawable/lock" 
    android:layout_below="@+id/login_car_icon"
    />

結果：

ここに画像の説明を入力してください

最後に、最後のEditTextの左側に画像を作成するためにこれが必要なのはなぜですか？

4

3 に答える 3

6

EditTextが2つあり、各EditTextの左側に画像を表示したいと思います。これを実行しようとすると、次の結果が得られます（Eclipseエディター）：[...]まず、これが機能しないのはなぜですか？

は次のRelativeLayoutようなことをします：

  • 親の幅を埋めるように設定されている最初の要素を取得しEditTextます（左上隅から配置されます（デフォルトの位置はRelativeLayout））。基本的に画面の幅全体を埋めます。
  • を取得します。はImageView、の左側に配置されますがEditText、EditTextが画面の左端から開始して画面全体に表示されるため、ImageViewは表示されている画面領域のEditText 外側の左側に配置されます。

ビューを希望どおりに配置する1つの方法は、次のとおりです。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="30dp"
    android:layout_marginRight="30dp"
    android:layout_marginTop="35dp"
    android:background="#010101"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/login_car_icon"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/user"
        />  

    <EditText
        android:id="@+id/login_carNumber"
        style="@style/EditTextDark"
        android:layout_toRightOf="@id/login_car_icon"  
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="@string/prompt_carNumber"
        android:inputType="phone"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textCursorDrawable="@null" >

        <requestFocus />
    </EditText>

    <EditText
        android:id="@+id/login_password"
        style="@style/EditTextDark"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/login_carNumber"
        android:layout_alignLeft="@id/login_carNumber"
        android:layout_marginTop="10dp"
        android:hint="@string/prompt_password"
        android:inputType="phone"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textCursorDrawable="@null" >
    </EditText>

    <ImageView
        android:id="@+id/login_lock_icon"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/lock"
        android:layout_alignTop="@id/login_password"
    />

</RelativeLayout>

2番目の質問; 2番目のEditTextのすぐ左ではなく、最初の画像の上に「南京錠」の画像があるのはなぜですか。

はRelativeLayout、画面の左上のポイントから子を（ルールが設定されていない状態で）配置します。ルールがない場合は、子供が賭けられてしまいます。

最後に、最後のEditTextの左側に画像を作成するためにこれが必要なのはなぜですか？

それはハックではありません。RelativeLayout2番目ImageViewの位置が最初の位置より下にあることを伝える必要がありますImageView。

于 2013-01-13T12:41:01.753 に答える
1

このコードを試してください このショーのレイアウトは、画像に示すように表示されます。

これはあなたのための仕事です。

ここに画像の説明を入力

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="30dp"
    android:layout_marginRight="30dp"
    android:layout_marginTop="35dp"
    android:background="#010101"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <EditText
        android:id="@+id/login_carNumber"
        style="@style/EditTextDark"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="@string/prompt_carNumber"
        android:inputType="phone"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textCursorDrawable="@null"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:layout_toRightOf="@+id/login_car_icon" >

        <requestFocus />
    </EditText>

    <ImageView
        android:id="@+id/login_car_icon"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/user"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true" />

    <EditText
        android:id="@+id/login_password"
        style="@style/EditTextDark"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"        
        android:layout_marginTop="10dp"
        android:hint="@string/prompt_password"
        android:inputType="phone"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textCursorDrawable="@null"
        android:layout_toRightOf="@+id/login_lock_icon"
        android:layout_below="@+id/login_car_icon" >
    </EditText>

    <ImageView
        android:id="@+id/login_lock_icon"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/lock"
        android:layout_below="@+id/login_car_icon" />

</RelativeLayout>
于 2013-01-13T12:32:29.350 に答える
0

論理的なアプローチは、最初に画像をロードしてから、編集テキスト ウィジェットをその右側にロードすることです。

于 2013-01-13T12:44:01.710 に答える