Кнопка появляется над другой кнопкой при нажатии на каждую из них / Android XML

#java #android #xml #kotlin #layer

Вопрос:

Привет, переполнение стека, я новичок в Android!

Я разрабатываю две кнопки, одна из которых находится над другой кнопкой, как два слоя в Photoshop.

ONE Положение кнопки в редакторе XML Android

Я пока не могу вставлять фотографии!

И вот кнопка ONE :

 <Button
        android:id="@ id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="84dp"
        android:background="@drawable/empty_yellow_circle"
        android:text="1"
        app:backgroundTint="@null"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent" />
 

TWO Положение кнопки в редакторе XML Android

И вот кнопка TWO :

     android:id="@ id/button2"
    android:layout_width="70dp"
    android:layout_height="70dp"
    android:layout_marginStart="76dp"
    android:layout_marginTop="48dp"
    android:background="@drawable/full_yellow_circle"
    android:text="2"
    app:backgroundTint="@null"
    app:layout_constraintBottom_toBottomOf="@ id/button1"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.558"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@ id/button1"
    app:layout_constraintVertical_bias="1.0" />
 

Чего я хочу?
Я хочу расположить эту кнопку так, как показано на фотографиях выше , кнопка ONE всегда застревает под кнопкой TWO и никогда не появляется над кнопкой TWO , как два фиксированных слоя.

Но во время тестового запуска, когда я нажимаю кнопку ONE , она появляется над кнопкой TWO и наоборот , как на фотографии ниже.

При нажатии на кнопку ОДИН и наоборот

Вы можете видеть на фотографии выше, что ONE граница кнопки находится над TWO текстом кнопки.

таким образом, они не являются фиксированными слоями, и расположение меняется за один клик. Мне нужна фиксированная договоренность.

Спасибо за помощь!

Ответ №1:

Это потому, что меняется transitionZ при нажатии на каждую кнопку. Чтобы преодолеть это, поместите нижнюю кнопку (ОДНУ) в отдельный контейнер (который имеет нулевую высоту) и убедитесь, что ее объявление находится перед верхней кнопкой (ДВУМЯ) в вашем XML-макете.

 <FrameLayout
    android:id="@ id/button1_container"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.498"
    app:layout_constraintStart_toStartOf="parent">
    <Button
        android:id="@ id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="84dp"
        android:background="@drawable/empty_yellow_circle"
        android:text="1"
        app:backgroundTint="@null" />
</FrameLayout>
<Button
    android:id="@ id/button2"
    android:layout_width="70dp"
    android:layout_height="70dp"
    android:layout_marginStart="76dp"
    android:layout_marginTop="48dp"
    android:background="@drawable/full_yellow_circle"
    android:text="2"
    app:backgroundTint="@null"
    app:layout_constraintBottom_toBottomOf="@ id/button1_container"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.558"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@ id/button1_container"
    app:layout_constraintVertical_bias="1.0" />
 

Это немного неприятный обходной путь, но помогает.

Комментарии:

1. Спасибо за ваш ответ, но у меня все еще есть другая проблема: 1. Работает ли он для нескольких кнопок? 2. Когда я пытаюсь заменить кнопку два снова в правом углу кнопка одна , как и прежде, в Android студии XML-редактор, невозможно сделать подобное снова с перетаскиванием мышью, и когда я пытался перетащить кнопку в точное положение, кнопка два вдруг упала на так и в том, что кнопка является частью макета по истечении этого времени.

2. <FrameLayout android:id="@ id/button1_container" <Button android:id="@ id/button1" <Button android:id="@ id/button2"/></FrameLayout> /// После попытки захватить кнопку ДВА рядом с кнопкой ОДИН ///

Ответ №2:

В качестве первого опубликованного ответа вы можете поместить свою первую кнопку макета <FrameLayout> ... </FrameLayout> , тогда ваша проблема будет исправлена , но это не соответствует стандартам проектирования и, как сказано на плакате, это немного неприятно. Это не работает для нескольких кнопок, и вы увидите проблемы и ошибки при проектировании после устранения проблемы таким образом.

Способ, которым я исправил свою проблему, заключается в добавлении XML-фигур вместо кнопок и добавлении кнопок с оттенком непрозрачности 0 для этих фигур. Таким образом, фигуры не являются кликабельными, поэтому они не будут располагаться друг над другом после нажатия. Это тоже неприятно, но оно более отзывчиво в дизайне.