【问题标题】:Constraint layout wrap textview but constraint width when its too long to let other views be visible约束布局包装文本视图,但约束宽度太长而无法让其他视图可见
【发布时间】:2021-04-02 02:32:08
【问题描述】:

我必须设计这个布局。图标应该坚持textview

这是我尝试过的,看起来正是需要的。

<androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingStart="@dimen/padding_m"
        android:paddingTop="@dimen/padding_s"
        android:paddingEnd="@dimen/padding_m"
        android:paddingBottom="@dimen/padding_s"
        app:layout_constraintTop_toTopOf="parent">

        <LinearLayout
            android:id="@+id/title_container"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@id/more_options"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent">

            <TextView
                android:id="@+id/active_group_name"
                style="@style/AppbarTitle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:maxLines="1"
                app:layout_constrainedWidth="true"
                tools:text="Ranjan Malav" />

            <FrameLayout
                android:id="@+id/account_option_icon_container"
                android:layout_width="36dp"
                android:layout_height="36dp"
                android:layout_gravity="center"
                android:layout_marginStart="@dimen/margin_xs"
                android:background="@drawable/circle_background_36dp">

                <ImageView
                    android:id="@+id/account_option_icon"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    app:srcCompat="@drawable/ic_outline_settings_24" />
            </FrameLayout>

        </LinearLayout>

        <ImageView
            android:id="@+id/more_options"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_baseline_more_vert_24"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

但是当文本很长时,设置图标会被隐藏。

我怎样才能给图标优先级,让它占据空间,然后 textview 应该将自己包裹在剩余的空间中?

【问题讨论】:

  • 我会说这很容易做到,但为什么不使用TextViewdrawableEnd 属性中的图标,这样就无需使用单独的小部件ImageView
  • @Lalit 这需要创建一个带有圆形背景的新drawable。我想保持动态,这样我就可以以编程方式更改背景色调。
  • 您已经在做的是使用额外的两个小部件(FrameLayout 和 ImageView)和两个可绘制对象(背景和设置图标),它们可以替换为直接应用于 TextView 的图层列表可绘制对象。 TextView 的可绘制对象的背景色调可以动态更改,我相信使用 PorterDuffXMode,您还可以将色调应用于仅可绘制到背景的图层列表。
  • @LalitFauzdar 感谢 Lalit 的分享,我稍后会尝试实现。

标签: android android-layout android-constraintlayout


【解决方案1】:

在 textview 之前创建你的 ImageView

【讨论】:

    【解决方案2】:

    我认为你不能这样做,而且我认为让 ImageView 具有基于标题宽度的动态位置是不好的设计。

    我认为最好将您的 imageView 作为操作放入您的menu.xml

    【讨论】:

      【解决方案3】:

      这按预期工作。这个关于 strackoverflow 的答案很有帮助https://stackoverflow.com/a/44412219/6168272

      <androidx.constraintlayout.widget.ConstraintLayout
              android:id="@+id/toolbar"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:paddingStart="@dimen/padding_m"
              android:paddingTop="@dimen/padding_s"
              android:paddingEnd="@dimen/padding_m"
              android:paddingBottom="@dimen/padding_s"
              app:layout_constraintTop_toTopOf="parent">
      
              <TextView
                  android:id="@+id/active_group_name"
                  style="@style/AppbarTitle"
                  android:layout_width="0dp"
                  android:layout_height="wrap_content"
                  android:maxLines="1"
                  app:layout_constraintBottom_toBottomOf="parent"
                  app:layout_constraintHorizontal_bias="0.0"
                  app:layout_constraintHorizontal_chainStyle="packed"
                  app:layout_constraintLeft_toLeftOf="parent"
                  app:layout_constraintRight_toLeftOf="@id/account_option_icon_container"
                  app:layout_constraintTop_toTopOf="parent"
                  app:layout_constraintWidth_default="wrap"
                  tools:text="Ranjan Ranjan Ranjan Ranjan Ranjan" />
      
              <FrameLayout
                  android:id="@+id/account_option_icon_container"
                  android:layout_width="36dp"
                  android:layout_height="36dp"
                  android:layout_gravity="center"
                  android:layout_marginStart="@dimen/margin_xs"
                  android:background="@drawable/circle_background_36dp"
                  app:layout_constraintBottom_toBottomOf="parent"
                  app:layout_constraintEnd_toStartOf="@id/more_options"
                  app:layout_constraintStart_toEndOf="@id/active_group_name"
                  app:layout_constraintTop_toTopOf="parent">
      
                  <ImageView
                      android:id="@+id/account_option_icon"
                      android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:layout_gravity="center"
                      app:srcCompat="@drawable/ic_outline_settings_24" />
              </FrameLayout>
      
              <ImageView
                  android:id="@+id/more_options"
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:src="@drawable/ic_baseline_more_vert_24"
                  app:layout_constraintBottom_toBottomOf="parent"
                  app:layout_constraintEnd_toEndOf="parent"
                  app:layout_constraintTop_toTopOf="parent" />
      
      </androidx.constraintlayout.widget.ConstraintLayout>
      

      【讨论】:

        猜你喜欢
        • 2020-06-09
        • 2018-03-04
        • 2019-05-10
        • 1970-01-01
        • 1970-01-01
        • 2020-03-20
        • 2018-08-30
        • 2023-04-07
        • 1970-01-01
        相关资源
        最近更新 更多