如何在抖动中将图标叠加在图像上

Question

我必须在图像的右下角显示一个收藏夹图标。

Container(
   decoration: new BoxDecoration(color: Colors.white),
   alignment: Alignment.center,
   height: 240,
   child: Image.network(used_car.imageUrl,fit: BoxFit.fill) 
)

我想在该图像容器的右下方显示一个图标Icon.favorite。但是找不到任何扑动属性可以解决该问题或显示该问题。

Answer 1

您可以将其包装到Stack中：

Stack(
  children: <Widget>[
    Container(
        decoration: new BoxDecoration(color: Colors.white),
        alignment: Alignment.center,
        height: 240,
        child: Image.network(used_car.imageUrl,fit: BoxFit.fill)
    ),
    Align(
      alignment: Alignment.bottomRight,
      child: Icon(Icons.favorite),
    )
  ],
)

Answer 2

您可以使用Positioned中的Stack小部件来做得更好。

Container(
   decoration: new BoxDecoration(color: Colors.white),
   height: 240,
   child: Stack(
     children: <Widget>[
        Image.network(used_car.imageUrl,fit: BoxFit.fill),
        Positioned(
          bottom: 15, right: 15, //give the values according to your requirement
          child: Icon(Icons.favorite),
        ),
     ],
  ),
),

Answer 3

这是图标覆盖的另一种解决方案：

 <TextView
            android:id="@+id/myText2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Description"
            android:textSize="16sp"
            app:layout_constrainedWidth="true"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="@+id/myText1"
            app:layout_constraintTop_toBottomOf="@+id/myText1" />

结果是：