缩放子布局元素与父布局元素相同



我正在构建一个Android应用程序,该应用程序将具有一个罗盘面,上面显示了太阳的方位角位置。指南针面是一个 100x100 dp 矢量可绘制对象,我在两个维度上都用match_parent缩放以填充可用的屏幕区域。太阳图像是一个 10x10 dp 矢量可绘制对象,它叠加在罗盘图像的适当位置。它们都在一个ConstraintLayout内,也使用match_parent缩放。

我的问题是我找不到任何方法使太阳可绘制比例与指南针可绘制的系数相同。如果我使用match_parent,它会扩展以填充其父布局。如果我使用wrap_content,它根本不会放大,并且显示的大小远小于指南针面的 1/10。

以下是我的布局文件的摘录。是否有任何直接的方法,无论是在布局中还是在关联的活动中以声明方式,使较小的可绘制对象按与其同级指南针面可绘制相同的因子向上缩放?

脚注:我正在使用app:layout_constraintCircle*来定位太阳可绘制对象。我已经屈服于不得不根据我能够找到的少量信息在应用程序代码中扩展app:layout_constraintCircleRadius。但是,如果有一种方法可以使罗盘面也能绘制比例,那就太好了。

<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/compass_composite"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/toolbar"
android:layout_alignParentStart="true"
android:layout_alignParentTop="false">
<ImageView
android:id="@+id/compass_face"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:contentDescription="@string/content_compass_display"
android:scaleType="fitCenter"
android:src="@drawable/ic_compass_face"
android:tint="@android:color/darker_gray" />
<ImageView
android:id="@+id/sun"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintCircle="@+id/compass_face"
app:layout_constraintCircleRadius="45dp"
app:layout_constraintCircleAngle="210"
android:src="@drawable/ic_sun"
android:tint="@color/bg_noon"
android:visibility="visible" />
</androidx.constraintlayout.widget.ConstraintLayout>

我找到了一个解决方案:使用基于百分比的布局宽度和高度属性。它们需要大量的 xml 样板,但是一旦你把它拿出来,一切都会很好地工作。不过,我仍然必须通过蛮力缩放圆约束半径。我希望我找到更好的解决方案,或者未来的Android版本提供了更好的方法来做到这一点。

顺便说一下,这些所谓的"百分比"值实际上是小数 - 所以例如1/10是0.1,而不是10。我对此感到无理的恼火。:)

以下是我的布局摘录,展示了这个技巧:

<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/compass_rotating"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="false">
<ImageView
android:id="@+id/compass_face"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:contentDescription="@string/content_compass_display"
android:scaleType="fitCenter"
android:src="@drawable/ic_compass_face"
android:tint="@android:color/darker_gray" />
<ImageView
android:id="@+id/sun"
android:layout_width="0dp"
android:layout_height="0dp"
android:contentDescription="@string/content_sun_position"
android:tooltipText="@string/content_sun_position"
android:src="@drawable/ic_solid_dot"
android:tint="@color/sun_yellow"
app:layout_constraintCircle="@+id/compass_face"
app:layout_constraintCircleAngle="0"
app:layout_constraintCircleRadius="45dp"
app:layout_constraintHeight_default="percent"
app:layout_constraintHeight_percent="0.1"
app:layout_constraintWidth_default="percent"
app:layout_constraintWidth_percent="0.1"
tools:ignore="MissingConstraints" />

最新更新