Flutter应用Android桌面小部件添加View后加载失败，求解决方案

我有一个带Android桌面小部件的Flutter应用，想在LinearLayout里让ImageView居左、TextView居右，于是在中间加了个带weight属性的View填充空间。Android Studio设计视图显示正常，但运行时小部件提示“Problem loading widget”，删掉那个View就能正常加载，但两个控件会紧挨着。

布局代码：

<LinearLayout
    android:id="@+id/bottomContainer"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">


    <ImageView
        android:layout_height="46dp"
        android:layout_width="46dp"
        android:src="@drawable/icon_current" />

    <View
        android:layout_width="0dp"
        android:layout_weight="1"/>


    <TextView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:id="@+id/onethird"
        android:text="1/3 time: 02:04 AM"
        android:textColor="#FFFFFF"
        android:textSize="12sp"
        android:textStyle="bold" />


</LinearLayout>

方案1：修复LinearLayout的问题 #

桌面小部件对View的属性有严格限制，你加的空白View缺少layout_height属性，这是加载失败的核心原因。补上该属性即可解决：

<LinearLayout
    android:id="@+id/bottomContainer"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <ImageView
        android:layout_width="46dp"
        android:layout_height="46dp"
        android:src="@drawable/icon_current" />

    <!-- 补上layout_height属性，与父布局高度保持一致 -->
    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"/>

    <TextView
        android:id="@+id/onethird"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="1/3 time: 02:04 AM"
        android:textColor="#FFFFFF"
        android:textSize="12sp"
        android:textStyle="bold" />

</LinearLayout>

方案2：用RelativeLayout实现两端对齐（更简洁） #

相对于LinearLayout加空白View的方式，用RelativeLayout可直接通过属性实现两端对齐，避免冗余View：

<RelativeLayout
    android:id="@+id/bottomContainer"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:layout_width="46dp"
        android:layout_height="46dp"
        android:src="@drawable/icon_current"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"/>

    <TextView
        android:id="@+id/onethird"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="1/3 time: 02:04 AM"
        android:textColor="#FFFFFF"
        android:textSize="12sp"
        android:textStyle="bold"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"/>

</RelativeLayout>

方案3：用ConstraintLayout实现（更灵活） #

如果小部件支持ConstraintLayout（需确保依赖配置正确），也可以用它实现：

<androidx.constraintlayout.widget.ConstraintLayout
    android:id="@+id/bottomContainer"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/icon"
        android:layout_width="46dp"
        android:layout_height="46dp"
        android:src="@drawable/icon_current"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>

    <TextView
        android:id="@+id/onethird"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="1/3 time: 02:04 AM"
        android:textColor="#FFFFFF"
        android:textSize="12sp"
        android:textStyle="bold"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

内容的提问来源于stack exchange，提问作者1210saad