Переключить внутри TextInputLayout

Question

Я хотел бы выполнить задачу, показанную на двух изображениях ниже;точнее, иметь возможность каким-либо образом «расширять» TextInputLayout на коммутатор, чтобы он включался в вышеупомянутый макет вместе с TextInputEditText.

Все попытки, которые я сделал до сих пор, провалились.

XML-код для одного элемента приведен ниже:

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

                        <android.support.design.widget.TextInputLayout
                            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
                            android:layout_width="0dp"
                            android:layout_height="wrap_content"
                            android:layout_weight="1"
                            android:layout_marginEnd="10dp">

                            <android.support.design.widget.TextInputEditText
                                android:id="@+id/myprofile_twitter"
                                android:layout_width="match_parent"
                                android:textColor="@color/blue_grey_800"
                                android:layout_height="wrap_content"
                                android:hint="Twitter" />

                        </android.support.design.widget.TextInputLayout>

                        <Switch
                            android:id="@+id/twitter_switch"
                            android:layout_width="45dp"
                            android:layout_height="30dp"
                            android:layout_marginEnd="10dp"
                            android:layout_gravity="center_vertical"/>

                    </LinearLayout>

И вот два изображения (изображение1 - это то, как оно представлено в настоящее время, а изображение 2 - то, чего я хотел бы достичь - см. Linkedin).Хотя, не уверен, возможно ли это сделать.

Answer 1

Вы можете достичь этого формата с помощью этого примера макета.

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:layout_margin="10dp">


    <EditText
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="@drawable/background"
        android:inputType="text"
        android:layout_centerVertical="true"
        android:hint="LinkedIn"
        android:paddingLeft="5dp"/>

        <Switch
            android:id="@+id/twitter_switch"
            android:layout_width="45dp"
            android:layout_height="30dp"
            android:layout_centerVertical="true"
            android:layout_alignParentRight="true"/>

</RelativeLayout>

Пример снимка экрана:

Answer 2

Хотя это и не идеально, это обходной путь, позволяющий получить поведение, подобное тому, что вы ищете.Вы также можете изменить или создать другую рамку для Switch, чтобы она соответствовала несфокусированному состоянию TextInputLayout.

layout.xml

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.design.widget.TextInputLayout
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_marginEnd="10dp"
            android:layout_marginRight="10dp">

            <android.support.design.widget.TextInputEditText
                android:id="@+id/myprofile_twitter"
                android:layout_width="match_parent"
                android:textColor="@color/colorPrimaryDark"
                android:layout_height="wrap_content"
                android:hint="Twitter" />

        </android.support.design.widget.TextInputLayout>

        <Switch
            android:id="@+id/twitter_switch"
            android:background="@drawable/border"
            android:padding="18.5dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="1.5dp"
            android:layout_marginStart="-19dp"
            android:layout_marginLeft="-19dp"
            android:layout_marginEnd="10dp"
            android:layout_gravity="center_vertical"
            android:layout_marginRight="10dp" />

    </LinearLayout>

border.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

<item>
    <shape android:shape="rectangle" >
        <solid android:color="@color/colorAccent" />
        <corners android:topRightRadius="5dp" android:bottomRightRadius="5dp"/>

        <padding
            android:bottom="2dp"
            android:top="2dp"/>
    </shape>
</item>
<item android:right="10dp">
    <shape android:shape="rectangle" >
        <solid android:color="#fff" />

        <padding
            android:right="2dp" />
    </shape>
</item>
<item>
    <shape android:shape="rectangle" >
        <corners android:topRightRadius="5dp" android:bottomRightRadius="5dp"/>
        <solid android:color="#fff" />
    </shape>
</item>