【问题标题】:Constraint layout with stretchable view具有可拉伸视图的约束布局
【发布时间】:2018-10-23 22:29:41
【问题描述】:

我正在尝试构建响应式布局,但我无法这样做。我需要实现这些图纸上呈现的视图逻辑: (从底部)有一个固定大小的视图,固定在屏幕底部。在它上面有一个TextView。它的最小高度应该是中心线和底视图之间的空间。当有很多文本时,它应该增长到中心指南之上。在顶部有一个 ImageView,其最大高度是屏幕顶部和中心线之间的空间,并且没有最小高度。我当前的解决方案如下所示:

<ConstraintLayout>
    <ImageView
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="barrier" />

    <Textview
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toTopOf="bottomView" />

    <View
        android:layout_height="{some}dp"
        app:layout_constraintBottom_toBottomOf="parent" />

    <android.support.constraint.Barrier
        app:barrierDirection="top"
        app:constraint_referenced_ids="guidelineCenter,textView" />
<ConstraintLayout>

此时,长文本的情况可以正常工作,但如果文本很短,我最终会将文本锚定到底部视图。知道如何强制左图像所需的最小约束吗?

【问题讨论】:

  • 是否强制实现ConstraintLayout
  • @nimi0112 不,但我正在尝试尽可能多地使用它来学习它。如果您知道如何使用任何其他布局来实现它,请分享。
  • 是的,学习很好。但是,如果您受到打击,可以通过线性布局来实现,方法是根据您的逻辑以编程方式设置两个布局的 weight
  • @nimi0112 是的,使用LinearLayout 可以轻松实现左侧屏幕,但我认为右侧屏幕是不可能的。
  • 可以根据您的逻辑将它们的weights 设置为0.2 (ImageView)0.8(Textview) ,而不是将它们分配为相等的weights

标签: android android-constraintlayout


【解决方案1】:

据我所知,无法通过 XML 定义百分比最小高度,因此您必须在代码中强制执行最小高度。这里有两张图片显示的文字数量较少,而另一张图片的文字数量较长。红线用于显示 1/2 路点的位置和不需要的位置。也不需要设定为 50% 的准则。

activity_main.xml

<android.support.constraint.ConstraintLayout 
    android:id="@+id/layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@+id/textView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:minHeight="0dp"
        android:text="This is big text "
        app:layout_constraintBottom_toTopOf="@id/bottomView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

    <View
        android:id="@+id/bottomView"
        android:layout_width="0dp"
        android:layout_height="50dp"
        android:background="@color/colorPrimary"
        android:visibility="visible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

    <android.support.constraint.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.5" />

    <View
        android:id="@+id/view"
        android:layout_width="0dp"
        android:layout_height="1dp"
        android:background="@android:color/holo_red_light"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@id/guideline" />


</android.support.constraint.ConstraintLayout>

MainActivity.xml

public class MainActivity extends AppCompatActivity {
    private ConstraintLayout mLayout;
    private TextView mTextView;
    private View mBottomView;
    private int mMinHeight;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mLayout = findViewById(R.id.layout);
        mTextView = findViewById(R.id.textView);
        mBottomView = findViewById(R.id.bottomView);
        mTextView.setText(getResources().getString(R.string.large_text).substring(0, 1000));

        mLayout.post(new Runnable() {
            @Override
            public void run() {
                mMinHeight = mLayout.getHeight() / 2 - mBottomView.getHeight();
                if (mTextView.getHeight() < mMinHeight) {
                    mTextView.setMinHeight(mMinHeight);
                }
            }
        });
    }
}

【讨论】:

  • 我的做法略有不同,但也使用了 kotlin/java 代码。
猜你喜欢
  • 2017-08-11
  • 1970-01-01
  • 2019-05-25
  • 1970-01-01
  • 1970-01-01
  • 2020-03-20
  • 2018-11-04
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多