隐藏在选项卡布局后面的 TextView

Posted 2023-04-18

【中文标题】隐藏在选项卡布局后面的 TextView

【英文标题】：TextView hiding behind Tabs Layout

【发布时间】：2021-08-10 11:42:33

【问题描述】：

我在我的应用中实现了一个选项卡布局。并为每个选项卡创建了 3 个片段。所有片段都包含一个TextView，它是NestedScrollView 的子代。一切都按预期工作，直到传递给TextView 的字符串足够大并且需要滚动才能完全查看。当时TextView里面的文字隐藏在标签后面。

我已经尝试过这里提供的答案：Fragment from View Pager hiding behind Tab Bar 无济于事。

这是我的代码：

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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:layout_
    android:layout_
    tools:context=".PrayerActivity">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/view_pager"
        android:layout_
        android:layout_
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <com.google.android.material.appbar.AppBarLayout
        android:layout_
        android:layout_
        android:theme="@style/Theme.BuddhaPoojapathMarathi.AppBarOverlay">

        <!--<TextView
            android:id="@+id/title"
            android:layout_
            android:layout_
            android:gravity="center"
            android:minHeight="?actionBarSize"
            android:padding="@dimen/appbar_padding"
            android:text="@string/app_name"
            android:textAppearance="@style/TextAppearance.Widget.AppCompat.Toolbar.Title" />-->

        <com.google.android.material.tabs.TabLayout
            android:id="@+id/tabs"
            android:layout_
            android:layout_
            android:background="?attr/colorPrimary" />
    </com.google.android.material.appbar.AppBarLayout>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

这是其中的一个片段：

<?xml version="1.0" encoding="utf-8"?>
<androidx.core.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_
    android:layout_
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context=".Fragment_1">


    <TextView
        android:id="@+id/frag1_tv"
        android:layout_
        android:layout_
        android:layout_margin="@dimen/text_margin"
        android:textSize="@dimen/text_medium"
        android:layout_gravity="center"
        android:textAlignment="center"
        android:textColor="@color/black"
        android:paddingTop="48dp"
        android:text="@string/buddha_vandana_mar" />

</androidx.core.widget.NestedScrollView>

如图所示，文本的第一部分隐藏在选项卡后面。

更新：

PrayerActivity.java

public class PrayerActivity extends AppCompatActivity 

    private ActivityPrayerBinding binding;

    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);

        int num = getIntent().getIntExtra("num", 0);
        Bundle bundle = new Bundle();
        bundle.putInt("num", num);

        Log.d("myInt", String.valueOf(num));
        binding = ActivityPrayerBinding.inflate(getLayoutInflater());
        setContentView(binding.getRoot());

        SectionsPagerAdapter sectionsPagerAdapter = new SectionsPagerAdapter(this, getSupportFragmentManager(), num);
        ViewPager viewPager = binding.viewPager;
        viewPager.setAdapter(sectionsPagerAdapter);
        TabLayout tabs = binding.tabs;
        tabs.setupWithViewPager(viewPager);
    

【问题讨论】：

请在活动中添加您的代码

它可以滚动吗？

是的@TicherhazFreePalestine，它是可滚动的。

我可以知道你为什么使用CoordinatorLayout 吗？

这是 android studio 中新的选项卡式活动附带的默认布局。

【参考方案1】：

我建议您使用RelativeLayout 而不是CoordinatorLayout。首先，将布局更改为RelativeLayout。其次，将属性id 添加到AppBarLayout。最后，将属性layout_below 添加到ViewPager。你可以在下面看到。我没有测试代码。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:layout_
    android:layout_
    android:orientation="vertical"
    tools:context=".PrayerActivity">

<com.google.android.material.appbar.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_
    android:layout_
    android:theme="@style/Theme.BuddhaPoojapathMarathi.AppBarOverlay">

    <!--<TextView
        android:id="@+id/title"
        android:layout_
        android:layout_
        android:gravity="center"
        android:minHeight="?actionBarSize"
        android:padding="@dimen/appbar_padding"
        android:text="@string/app_name"
        android:textAppearance="@style/TextAppearance.Widget.AppCompat.Toolbar.Title" />-->



    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tabs"
        android:layout_
        android:layout_
        android:background="?attr/colorPrimary" />
</com.google.android.material.appbar.AppBarLayout>

    <androidx.viewpager.widget.ViewPager
    android:id="@+id/view_pager"
    android:layout_
    android:layout_
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</LinearLayout>

【讨论】：

不行！我按照您的建议编辑了代码，但仍然面临同样的问题。

@VishalA。我已经更新了答案。我添加了Toolbar

看起来是这样的：imgur.com/a/WF6xX39

@VishalA。你可以再试一次新的更新答案

这不起作用，伙计。您看到的 XML 是 MainActivity。并且TextView 位于Fragment 中，它具有不同的XML。现在，我无法在片段 XML 中使用这些选项卡占用的大小。如果我能做到，我的问题就迎刃而解了。

【参考方案2】：

只需将这一行放在 NestedScrollView 中

android:fillViewport="true"

【讨论】：

我试过了，可惜没用。

【参考方案3】：

请使用以下代码。

<LinearLayout 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:layout_
android:layout_
android:orientation="vertical"
tools:context=".activity.MainActivity">

<RelativeLayout
    android:layout_
    android:background="@color/black"
    android:layout_gravity="center"
    android:layout_>

    <ImageView
        android:id="@+id/back_btn"
        android:layout_
        android:layout_
        android:layout_marginTop="@dimen/_5sdp"
        android:layout_marginLeft="@dimen/_8sdp"
        android:src="@drawable/back_arrow"/>

    <TextView
        android:layout_
        android:layout_
        android:textColor="@color/white"
        android:layout_toRightOf="@+id/back_btn"
        android:layout_marginLeft="@dimen/_10sdp"
        android:padding="@dimen/_8sdp"
        android:text="@string/my_listing_text"
        android:textSize="@dimen/_14sdp"/>

</RelativeLayout>

<View
    android:layout_
    android:layout_
    android:background="@color/dark_gray"/>

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tablayout"
    android:layout_
    android:layout_
    android:background="@color/black"
    app:tabIndicatorColor="@color/white"/>

<androidx.viewpager.widget.ViewPager
    android:id="@+id/viewpager"
    android:layout_
    android:layout_
    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

【讨论】：

我正在做一些更改，请尝试