我正在尝试使用ViewPager和Fragments(类似于此Intro Slider Tutorial)为AndroidX应用创建简介,并遇到布局问题。
我有一个片段,我希望其中的内容垂直居中。我添加了ScrollView作为Fragment的根元素,以防内容太长而无法容纳屏幕。
如果内容不太长,它们将居中对齐,并且不会被剪切掉:
centering working
如果它们太长,则内容的顶部将被切除,并且在底部添加一些额外的空间(似乎正好是从顶部切除的高度):
overlong content, title cut off
overlong content, additional space at the bottom
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimary"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:scrollbars="vertical">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/web_view_fragment_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_vertical">
<TextView
android:id="@+id/web_view_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimaryDark"
android:lineSpacingMultiplier="1.2"
android:text="Title"
android:textAlignment="center"
android:textColor="@android:color/white"
android:textSize="24sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<WebView
android:id="@+id/web_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/web_view_title" />
<TextView
android:id="@+id/web_view_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/design_default_color_on_secondary"
android:lineSpacingMultiplier="1.2"
android:padding="0dp"
android:text="Description"
android:textAlignment="center"
android:textColor="@android:color/white"
android:textSize="18sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/web_view" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
请注意: Android Studio为ScrollView显示警告:
ScrollView大小验证
此androidx.constraintlayout.widget.ConstraintLayout应使用android:layout_height =“ wrap_content”
ScrollView子项必须在滚动维度中将其layout_width或layout_height属性设置为wrap_content而不是fill_parent或match_parent
问题ID:ScrollViewSize
但是,将ScrollView的 layout_height 更改为 wrap_content 不能来解决问题,并显示错误而不是警告:
wrap_content父级中的WebViews
将放置在使用wrap_content layout_height的父元素中会导致细微的错误。请改用match_parent
WebView实现具有某些性能优化,如果父视图使用wrap_content而不是match_parent,则这些性能优化将无法正常工作。这可能导致细微的UI错误。
问题ID:WebViewLayout
<?xml version="1.0" encoding="utf-8"?>
<!-- intro_activity -->
<androidx.constraintlayout.widget.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:id="@+id/intro_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/blueGray700">
<androidx.viewpager.widget.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="@id/divider"
app:layout_constraintEnd_toStartOf="@id/divider"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="spread_inside" />
<View
android:id="@+id/divider"
android:layout_width="0dp"
android:layout_height="1dp"
android:background="?android:attr/listDivider"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/intro_tab_layout" />
<com.google.android.material.tabs.TabLayout
android:id="@+id/intro_tab_layout"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/intro_continue_button"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toEndOf="@+id/intro_skip_button"
app:layout_constraintTop_toBottomOf="@+id/pager"
app:tabBackground="@drawable/tab_selector"
app:tabGravity="center"
app:tabIndicatorHeight="0dp"
app:tabMaxWidth="16dp" />
<Button
android:id="@+id/intro_skip_button"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp"
android:text="@string/intro_skip_button"
android:textColor="@android:color/white"
android:onClick="finishTutorial"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/pager" />
<Button
android:id="@+id/intro_continue_button"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="nextFragment"
android:padding="5dp"
android:text="@string/intro_continue_button"
android:textColor="@android:color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="@+id/pager"
app:layout_constraintTop_toBottomOf="@+id/pager" />
</androidx.constraintlayout.widget.ConstraintLayout>
很显然,我的版式有问题,但我无法弄清楚问题出在哪里。任何帮助将不胜感激!
我到目前为止发现的内容: