code

화면 밖으로 확장되는 구속조건 레이아웃 내부의 Wrap_content 뷰

starcafe 2023. 8. 21. 21:28
반응형

화면 밖으로 확장되는 구속조건 레이아웃 내부의 Wrap_content 뷰

나는 간단한 채팅 버블을 사용하여 구현하려고 합니다.ConstraintLayout이것이 제가 성취하고자 하는 것입니다.

enter image description here enter image description here

하지만,wrap_content내가 원하는 것을 하지 않습니다.여백을 존중하지만 뷰 경계 밖으로 확장됩니다.내 레이아웃은 다음과 같습니다.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout   xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/chat_message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="16dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintHorizontal_bias="0"
        tools:background="@drawable/chat_message_bubble"
        tools:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sodales accumsan tortor at bibendum."
        android:layout_marginStart="64dp"
        android:layout_marginLeft="64dp"
        android:layout_marginEnd="32dp"
        android:layout_marginRight="32dp"
        android:layout_marginTop="8dp"
        android:layout_marginBottom="8dp" />
</android.support.constraint.ConstraintLayout>

다음과 같이 렌더링됩니다.

enter image description here

사용 중com.android.support.constraint:constraint-layout:1.0.0-beta4.

내가 뭘 잘못하고 있나요?그것은 버그인가요 아니면 단지 무의식적인 행동인가요?를 사용하여 올바른 동작을 수행할 수 있습니까?ConstraintLayout(다른 레이아웃을 사용할 수 있다는 것을 알고 있습니다.)ConstrainLayout구체적으로).

업데이트됨(제약 조건 레이아웃 1.1.+)

사용하다app:layout_constrainedWidth="true"와 함께android:layout_width="wrap_content"

이전(사용되지 않음):

app:layout_constraintWidth_default="wrap"와 함께android:layout_width="0dp"

오래된 항목:더 나은 답변 보기

아니요, 현재와 같이 ConstraintLayout으로 원하는 작업을 수행할 수 없습니다(1.0 베타 4).

  • wrap_content위젯이 자체 측정을 요청할 뿐, 위젯의 확장을 제한하지 않습니다.
  • match_constraints(0dp) 제약 조건에 따라 위젯의 크기를 제한합니다.하지만 그들과 일치할 것입니다.wrap_content더 작았을 것입니다(첫 번째 예), 그것도 당신이 원하는 것이 아닙니다.

그래서 지금 당장은, 그 특정한 경우에는 운이 없습니다 :-/

이제... 우리는 다른 기능을 추가하는 것에 대해 생각하고 있습니다.match_constraints이 정확한 시나리오를 처리하기 위해(예:wrap_content크기가 제약 조건 이상으로 끝나지 않는 한).

하지만 이 새로운 기능이 1.0 버전 이전에 출시될 것이라고는 장담할 수 없습니다.

편집: 1.0에서 속성을 사용하여 이 기능을 추가했습니다.app:layout_constraintWidth_default="wrap"(폭을 0dp로 설정).설정된 경우 위젯의 크기는 wrap_content를 사용하는 경우와 동일하지만 제약 조건에 의해 제한됩니다(즉, 제한 범위를 넘어서 확장되지 않음).

업데이트 이제 해당 태그는 더 이상 사용되지 않습니다. 대신 layout_width="WRAP_CONTENT" 및 layout_constrainedWidth="true".

Nikolas Roard의 답변에서 언급했듯이, 당신은 추가해야 합니다.app:layout_constraintWidth_default="wrap"너비를 0dp로 설정합니다.그리고 거품을 오른쪽으로 맞추려면 1.0을 설정해야 합니다.layout_constraintHorizontal_bias.

최종 소스 코드는 다음과 같습니다.

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TextView
        android:id="@+id/chat_message"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:layout_marginTop="8dp"
        android:layout_marginStart="64dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="8dp"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintWidth_default="wrap"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        android:background="@drawable/chat_message_bubble"
        android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sodales accumsan tortor at bibendum." />

</android.support.constraint.ConstraintLayout>

결과적으로 다음과 같습니다.

enter image description here

이미 언급한 다른 답변과 마찬가지로 제약 조건 레이아웃 1.0 이후에는 이를 달성할 수 있지만 최신 릴리스(1.1.x)부터는 이를 수행하는 방법이 변경되었습니다.

Constraint Layout 1.1 릴리스 이후 이전 버전app:layout_constraintWidth_default="wrap"그리고.app:layout_constraintHeight_default="wrap"이제 속성이 더 이상 사용되지 않습니다.

다음을 제공하려는 경우wrap_contentvoice에view의 및를 작동, 그나여뷰제조약적건을용다니로 . 뷰의 너비 및/또는 높이를wrap_content와결여하와 app:layout_constrainedWidth=”true|false” 및/는app:layout_constrainedHeight=”true|false”문서에 명시된 속성:

WRAP_CONTENT : 제약 조건 적용(1.1에서 추가됨) 치수가 WRAP_CONTENT로 설정된 경우 1.1 이전 버전에서는 문자 차원으로 처리됩니다. 즉, 제약 조건이 결과 차원을 제한하지 않습니다.일반적으로 이 정도면 충분하지만(그리고 더 빠릅니다), 상황에 따라 WRAP_CONTENT를 사용하면서 제약 조건을 계속 적용하여 결과 차원을 제한할 수 있습니다.이 경우 해당 속성 중 하나를 추가할 수 있습니다.

app:layout_constrainedWidth="true|false" app:layout_constrainedHeight="true|false"

최신 릴리스의 경우, 제가 이 질문에 답했을 때 Constraint Layout은 버전 1.1.2에 있습니다.

Deprecation of app:layout_constraintWidth_default text and its alternative

@의 대답.app:layout_constraintWidth_default="wrap"그리고.android:layout_width="0dp"이제 더 이상 사용되지 않습니다.

사하십오시를 사용해 보세요.app:layout_constrainedWidth="true"그리고.android:layout_width="wrap_content".

저는 그 이유를 모르겠습니다.그러나 제약 조건 레이아웃의 소스 코드에서는 오른쪽입니다.

교체해야 합니다.

android:layout_width="wrap_content"

와 함께

android:layout_width="match_parent"

TextView에서 패딩과 여백을 적절히 조정할 수 있습니다.코드를 업데이트했습니다.

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<TextView
    android:id="@+id/chat_message"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="8dp"
    android:layout_marginEnd="10dp"
    android:layout_marginLeft="60dp"
    android:layout_marginRight="10dp"
    android:layout_marginStart="60dp"
    android:layout_marginTop="8dp"
    android:padding="16dp"
    app:layout_constraintTop_toTopOf="parent"
    tools:background="#c9c7c7"
    tools:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sodales accumsan tortor at bibendum." />

당신은 이 결과를 얻을 것입니다.

나는 이것을 사용합니다.

app:layout_constraintEnd_toEndOf="parent"

언급URL : https://stackoverflow.com/questions/40850966/wrap-content-view-inside-a-constraintlayout-stretches-outside-the-screen

반응형