51

EditText内に画像ボタンを配置したいのですが、アイデアがありません。図に示すように、その方法を教えてください。ありがとう

ここに画像の説明を入力

4

12 に答える 12

58

その画像をクリックしたくない場合はdrawableRight、EditText のプロパティを使用できます。

android:drawableRight="@drawable/icon"

クリックしたい場合は、以下のコードを使用してください。

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

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Enter search key" />

    <ImageButton
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:src="@drawable/search"
        android:layout_centerVertical="true"
        android:layout_margin="5dp"
        android:text="Button"/>

</RelativeLayout>
于 2012-10-31T04:43:25.237 に答える
37

そのようなレイアウトとクリック可能な画像が必要な場合は、次のようなことができます

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <EditText
        android:id="@+id/editText1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true" >

    </EditText>
     <ImageView
        android:id="@+id/imageView1"
        android:padding="5dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/editText1"
        android:layout_alignBottom="@+id/editText1"
        android:layout_alignRight="@+id/editText1"
        android:src="@drawable/ic_launcher" />

</RelativeLayout>

出力：

ここに画像の説明を入力

于 2012-10-31T04:49:19.873 に答える
7

editText私のソリューションは、 「後ろ」に行くことなく、すべての画面サイズに適合しますimageButton。これも Android リソースを使用するため、独自のアイコンまたは文字列リソースを提供する必要はありません。このスニペットをコピーして、検索バーが必要な場所に貼り付けます。

   <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="horizontal">
  
   <EditText
        android:layout_margin="8dp"
        android:id="@+id/etSearch"
        android:hint="@android:string/search_go"
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"/>

    <ImageView
        android:id="@+id/ivSearch"
        android:background="@color/transparent_black"
        android:padding="2dp"
        android:layout_width="wrap_content"
        android:layout_margin="8dp"
        android:src="@android:drawable/ic_menu_search"
        android:layout_height="wrap_content"
        tools:ignore="contentDescription" />

</LinearLayout>

結果:

ここに画像の説明を入力

于 2015-01-01T21:04:28.290 に答える
5

以下のコードを使用できます：

android:drawableRight="@android:drawable/ic_menu_search"

于 2012-10-31T04:43:03.950 に答える
4

このように RelativeLayout に配置するのはどうですか?:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <!-- EditText for Search -->
    <EditText android:id="@+id/inputSearch"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:hint="Search whatever..."
            android:textSize="14dp"
            android:textStyle="italic"
            android:drawableLeft="@drawable/magnifyingglass"
            android:inputType="textVisiblePassword"
            android:theme="@style/EditTextColorCustom"/>

         <Button
            android:id="@+id/btn_clear"
            android:layout_width="14dp"
            android:layout_height="14dp"
            android:layout_marginTop="10dp"
            android:layout_alignRight="@+id/inputSearch"
            android:layout_marginRight="5dp"
            android:background="@drawable/xbutton"
            android:visibility="gone"/>
    </RelativeLayout>

また、この方法でボタンの可視性 (GONE / VISIBLE) をコードで処理できます。

それが役に立てば幸い。

于 2016-08-31T15:56:55.410 に答える
1

これは私が感じる非常に単純です。親レイアウトとして相対レイアウトを使用します。次のいずれかを使用して、editText を左に、ImageButton を右に配置します。

  • ImageButton の alignRight プロパティ
  • 各フィールドのレイアウトの重みを指定することによって
于 2013-12-09T11:59:25.107 に答える
1

クリック可能な複合ドローアブルを使用したソリューションがあります。非常にうまく機能しています - 私はそれをテストしました

解決

于 2013-08-22T11:10:33.950 に答える
1

EditText を線形レイアウト (水平) 内に配置し、その横にイメージ ボタンを追加します (パディング 0)。EditText と ImageButton の背景色を設定すると、ブレンドされます。

于 2012-10-31T04:45:29.237 に答える
0

受け入れられた回答では、波及効果は機能せず、背面のボタンの後ろにとどまります。

この例では、テキスト ボックスに 2 つのボタンがあります。親レイアウトが持っているため、波及効果が機能します

   android:background="@android:color/transparent"

波紋が機能し、背面にとどまらないようにするには、イメージボタンの親背景を透明に設定します。

 <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@android:color/transparent"
            android:focusableInTouchMode="true"
            android:layout_margin="4dp">

            <EditText
                android:id="@+id/editText"
                style="@android:style/TextAppearance.Medium"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="2dp"
                android:layout_marginTop="2dp"
                android:layout_marginRight="2dp"
                android:background="@drawable/shape_textbox"
                android:hint="text"
                android:imeOptions="actionDone"
                android:importantForAutofill="no"
                android:inputType="text" />

            <ImageButton
                android:id="@+id/btn1"
                android:layout_width="44dp"
                android:layout_height="44dp"
                android:layout_centerVertical="true"
                android:layout_margin="5dp"
                android:layout_toStartOf="@+id/btn2"
                android:background="?android:selectableItemBackgroundBorderless"
                android:src="@drawable/ic_btn1" />

            <ImageButton
                android:id="@+id/btn2"
                android:layout_width="44dp"
                android:layout_height="44dp"
                android:layout_alignParentEnd="true"
                android:layout_centerVertical="true"
                android:layout_margin="5dp"
                android:background="?android:selectableItemBackgroundBorderless"
                android:contentDescription="@string/clear"
                android:src="@drawable/ic_btn2" />

        </RelativeLayout>

または、フレーム レイアウトでボタンをラップすることもできます。

<FrameLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@android:color/transparent"
    android:layout_alignParentEnd="true"
    android:layout_centerVertical="true"
    >
<ImageButton ... />
</FrameLayout>
于 2021-03-15T15:13:26.387 に答える
-1

達成するために配置したい理由がわかりません。これは、次ImageButtonの単純なプロパティで実行できますEditText

android:drawableRight="あなたのドローアブル"

それはあなたのために働くことはできませんか？

于 2013-04-16T12:48:59.947 に答える
-2

EditText で android:drawableLeft プロパティを使用します。

<EditText
    ...     
    android:drawableLeft="@drawable/my_icon" />
于 2012-10-31T04:42:50.853 に答える