2

我想知道 Constraintlayout 是否可以实现以下目标：

在此处输入图像描述

我有一个具有固定比率 (2:1) 的图像，并希望它覆盖一个渐变，渐变应该从图像的底部开始，顶部对齐到图像高度的 50%。据我所知，这是不可能的。使用指南不起作用，因为它只能与父/布局的百分比一起放置 使用weight只能在链中使用，但由于我需要覆盖两个视图链不能使用，对吗？

4

3 回答 3

1

你可以像下面这样实现：

<?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="match_parent">


    <ImageView
        android:id="@+id/imageView4"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintDimensionRatio="2:1"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@android:color/darker_gray" />

    <View
        android:id="@+id/View_Top"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintDimensionRatio="4:1"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@android:color/transparent" />

    <View
        android:id="@+id/View_Bottom"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintDimensionRatio="4:1"
        app:layout_constraintTop_toBottomOf="@id/View_Top"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@android:color/holo_orange_dark" />



    </android.support.constraint.ConstraintLayout>

这里 imageView 以 2:1 的比例设置，并且在 Imageview 上方设置了 2 个额外视图，其中 View_Top 是透明的，View_Bottom 是 imageview 的下半部分，因此您可以在 View_Bottom 中设置渐变。

在下图中，背景颜色为灰色，您的颜色可以替换为 View_Bottom 颜色

在此处输入图像描述 希望它会帮助你..！

于 2018-03-27T13:43:20.093 回答
0 
<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >
    <android.support.v7.widget.CardView
        android:id="@+id/sibling"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        >
    </android.support.v7.widget.CardView>
    <android.support.v7.widget.AppCompatImageView
        android:id="@+id/view_to_move"
        app:layout_constraintBottom_toBottomOf="@id/sibling"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@id/sibling"
        /></android.support.constraint.ConstraintLayout>

布局所需的其余属性...重要的两个属性 app:layout_constraintBottom_toBottomOf="@id/sibling" 和 app:layout_constraintTop_toTopOf="@id/sibling" 两者都必须在约束内。

于 2018-07-07T15:45:50.717 回答
0

据我了解，您希望在图像上添加渐变层。您可以通过为图像设置前景可绘制对象来做到这一点：

android:foreground="@drawable/gradient-layer"

然后让你的gradient-layer.xml类似于

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
    <gradient
        android:angle="90"
        android:endColor="@color/transparent"
        android:startColor="@color/color1"
        android:type="linear" />
    <corners android:radius="0dp"/>
</shape>

此外，如果您需要它更具体，您可以在渐变中添加中间颜色

android:centerColor="@color/color2"
于 2018-03-27T13:53:17.897 回答