无法在LinearLayout中垂直居中PercentRelativeLayout的问题咨询
问题分析与解决方案
我来帮你梳理下问题的根源,以及给出两种能解决需求的布局方案:
为什么相机始终从顶部开始显示?
你的根布局是垂直方向的LinearLayout,它的子View会默认按从上到下的顺序排列。第一个子View(PercentRelativeLayout)的高度是wrap_content,而里面的FrameLayout设置了100%宽度和1:1的宽高比,所以这个PercentRelativeLayout的高度就等于屏幕宽度,它会直接紧贴屏幕顶部显示;第二个LinearLayout用了match_parent高度,会占据屏幕剩下的所有空间。这就是相机无法垂直居中的核心原因。
你之前尝试的layout_gravity或者用LinearLayout包裹相机的思路没生效,是因为在垂直方向的LinearLayout中,layout_gravity只能控制子View的水平对齐,垂直方向的对齐需要调整父布局的结构或者使用更合适的布局容器。
方案一:改用RelativeLayout(兼容你现有的PercentRelativeLayout)
把根布局换成RelativeLayout,就能直接让相机垂直居中,同时让拍摄按钮容器位于相机下方并占满剩余空间:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/llCameraFragment" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#000000"> <!-- 方形相机,通过layout_centerVertical实现垂直居中 --> <android.support.percent.PercentRelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_centerVertical="true"> <FrameLayout android:id="@+id/tvCamera" app:layout_widthPercent="100%" app:layout_aspectRatio="100%" /> </android.support.percent.PercentRelativeLayout> <!-- 拍摄按钮容器,位于相机下方,占满剩余空间并居中按钮 --> <LinearLayout android:id="@+id/llBelowCamera" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_below="@id/tvCamera" android:gravity="center"> <ImageView android:id="@+id/ivCaptureImage" android:layout_width="100dp" android:layout_height="100dp" android:src="@drawable/camerashutter" /> </LinearLayout> </RelativeLayout>
方案二:改用ConstraintLayout(更现代灵活的布局方式)
ConstraintLayout可以大幅减少布局嵌套,更简洁地实现你的需求:
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/llCameraFragment" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#000000"> <!-- 方形相机:宽占满屏幕,高等于宽,通过约束实现垂直居中 --> <FrameLayout android:id="@+id/tvCamera" android:layout_width="match_parent" android:layout_height="0dp" app:layout_constraintDimensionRatio="1:1" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> <!-- 拍摄按钮:位于相机下方,在剩余空间中自动水平垂直居中 --> <ImageView android:id="@+id/ivCaptureImage" android:layout_width="100dp" android:layout_height="100dp" android:src="@drawable/camerashutter" app:layout_constraintTop_toBottomOf="@id/tvCamera" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
这两种方案都能实现你要的效果:方形相机垂直居中,拍摄按钮在相机下方的剩余空间里居中显示。
内容的提问来源于stack exchange,提问作者raquel lones
相关产品推荐
相关产品推荐

