Показать DialogFragment над TabLayout

Question

Я пытаюсь показать полноэкранный диалог DialogFragment таким образом, что ActionBar все еще отображается, но вкладки в TabLayout скрыты.

Изображение слева - это то, что мне удалось достичь; изображение на правом является то, что я стремлюсь к:

Есть два вопроса:

1. Вкладки по-прежнему показано, что пользователь может взаимодействовать с;
2. Из-за дополнительного FrameLayout, чтобы отобразить диалоговое окно, содержимое ViewPager по-прежнему отображается (кнопка FAB не является частью диалога). Это также означает, что пользователь может взаимодействовать с содержимым в пейджере, что включает возможность изменения вкладок.

Основная деятельность Layout (main.xml)

<?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" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 

    <android.support.design.widget.CoordinatorLayout 
     android:id="@+id/toolbar_layout" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

     <!-- Use ThemeOverlay to make the toolbar and tablayout text 
      white --> 
     <android.support.design.widget.AppBarLayout 
      android:id="@+id/abl_top" 
      android:layout_height="wrap_content" 
      android:layout_width="match_parent" 
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

      <android.support.v7.widget.Toolbar 
       android:id="@+id/toolbar" 
       android:fitsSystemWindows="true" 
       android:layout_height="wrap_content" 
       android:layout_width="match_parent" 
       app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
       app:layout_scrollFlags="scroll|enterAlways"/> 

      <android.support.design.widget.TabLayout 
       android:id="@+id/tab_layout" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       style="@style/CustomTabStyle"/> 

     </android.support.design.widget.AppBarLayout> 
    </android.support.design.widget.CoordinatorLayout> 

    <FrameLayout 
     android:id="@+id/content" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 
    </FrameLayout> 

    <android.support.v4.view.ViewPager 
     android:id="@+id/viewpager" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

</LinearLayout> 

MainActivity.java

package com.example.app; 

import android.content.Context; 
import android.graphics.drawable.Drawable; 
import android.os.Bundle; 
import android.support.design.widget.TabLayout; 
import android.support.v4.app.Fragment; 
import android.support.v4.app.FragmentManager; 
import android.support.v4.app.FragmentPagerAdapter; 
import android.support.v4.view.ViewPager; 
import android.support.v7.app.ActionBar; 
import android.support.v7.app.AppCompatActivity; 
import android.support.v7.widget.Toolbar; 
import android.text.Spannable; 
import android.text.SpannableString; 
import android.text.style.ImageSpan; 
import android.util.Log; 

import java.util.ArrayList; 
import java.util.List; 

public class MainActivity 
    extends AppCompatActivity 
{ 
    private static final String TAG = "MainActivity"; 

    @Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.main); 

     // Setup AppBar 
     Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); 
     if (toolbar != null) { 
      setSupportActionBar(toolbar); 
     } 

     // Setup ViewPager 
     ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager); 
     if (viewPager != null) { 
      setupViewPager(viewPager); 
     } 

     // Setup TabLayout 
     TabLayout tl = (TabLayout) findViewById(R.id.tab_layout); 
     tl.setupWithViewPager(viewPager); 
    } 

    @Override 
    public void onBackPressed() { 
     super.onBackPressed(); 
    } 

    private void setupViewPager(ViewPager viewPager) { 
     Adapter adapter = new Adapter(
      getSupportFragmentManager(), MainActivity.this); 
     adapter.addFragment(
      new Fragment1(), 
      "Tab 1", R.drawable.numeric_1_box_outline); 
     adapter.addFragment(
      new Fragment2(), 
      "Tab 2", R.drawable.numeric_2_box_outline); 
     viewPager.setAdapter(adapter); 
    } 

    static class Adapter extends FragmentPagerAdapter { 
     private final List<Fragment> mFragments = new ArrayList<>(); 
     private final List<Integer> mFragmentIcons = new ArrayList<>(); 
     private final List<String> mFragmentTitles = new ArrayList<>(); 
     private Context context; 

     public Adapter(FragmentManager fm, Context context) { 
      super(fm); 
      this.context = context; 
     } 

     public void addFragment(Fragment fragment, String title, int iconId) { 
      mFragments.add(fragment); 
      mFragmentTitles.add(title); 
      mFragmentIcons.add(iconId); 
     } 

     @Override 
     public Fragment getItem(int position) { 
      return mFragments.get(position); 
     } 

     @Override 
     public int getCount() { 
      return mFragments.size(); 
     } 

     @Override 
     public CharSequence getPageTitle(int position) { 
      Drawable image = context.getResources().getDrawable(
        mFragmentIcons.get(position), null); 
      image.setBounds(0, 0, image.getIntrinsicWidth(), 
        image.getIntrinsicHeight()); 
      SpannableString sb = new SpannableString(" " + mFragmentTitles.get(position)); 
      ImageSpan imageSpan = new ImageSpan(image, ImageSpan.ALIGN_BOTTOM); 
      sb.setSpan(imageSpan, 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); 
      return sb; 
     } 
    } 

} 

Answer 1

Если вы хотите, чтобы диалог будет полный экран, вид корень должен быть FrameLayout (вместо LinearLayout). Если вы хотите, чтобы в диалоговом окне содержалась панель инструментов, вам также понадобится вторая панель инструментов, так как ваша первая будет прикреплена к TabLayout.

Что-то, как это должно работать:

activity_main.xml

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" 
    android:id="@+id/container"> 

    <android.support.design.widget.CoordinatorLayout 
     android:id="@+id/toolbar_layout" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 

     <android.support.v4.view.ViewPager 
      android:id="@+id/viewpager" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

     <!-- Use ThemeOverlay to make the toolbar and tablayout text 
      white --> 
     <android.support.design.widget.AppBarLayout 
      android:id="@+id/abl_top" 
      android:layout_height="wrap_content" 
      android:layout_width="match_parent" 
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

      <android.support.v7.widget.Toolbar 
       android:id="@+id/toolbar" 
       android:fitsSystemWindows="true" 
       android:layout_height="wrap_content" 
       android:layout_width="match_parent" 
       app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
       app:layout_scrollFlags="scroll|enterAlways"/> 

      <android.support.design.widget.TabLayout 
       android:id="@+id/tab_layout" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content"/> 

     </android.support.design.widget.AppBarLayout> 

     <android.support.design.widget.FloatingActionButton 
      android:layout_height="wrap_content" 
      android:layout_width="wrap_content" 
      app:layout_anchor="@id/toolbar_layout" 
      app:layout_anchorGravity="bottom|right|end" 
      app:borderWidth="0dp" 
      android:layout_margin="20dp" 
      android:clickable="true"/> 

    </android.support.design.widget.CoordinatorLayout> 


</FrameLayout> 

MainActivity.java

... 

@Override 
public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 

    // Setup AppBar 
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); 
    if (toolbar != null) { 
     setSupportActionBar(toolbar); 
    } 

    // Setup ViewPager 
    ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager); 
    if (viewPager != null) { 
     setupViewPager(viewPager); 
    } 

    // Setup TabLayout 
    TabLayout tl = (TabLayout) findViewById(R.id.tab_layout); 
    tl.setupWithViewPager(viewPager); 


    FragmentTransaction transaction = getSupportFragmentManager().beginTransaction(); 
    transaction.add(R.id.container, new DialogFragment()); 
    transaction.addToBackStack("tag"); 
    transaction.commit(); 
} 

... 

fragment_dialog.xml

<?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" 
    android:orientation="vertical" android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/fragment_toolbar" 
     android:fitsSystemWindows="true" 
     android:layout_height="wrap_content" 
     android:layout_width="match_parent" 
     android:background="?attr/colorPrimaryDark" 
     app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/> 
    <FrameLayout 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:background="@android:color/background_light"> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="This is the dialog"/> 
     </FrameLayout> 

</LinearLayout> 

DialogFragment.java

public class DialogFragment extends Fragment { 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
          Bundle savedInstanceState) { 
     View view = inflater.inflate(R.layout.fragment_dialog, container, false); 


     final Toolbar toolbar = (Toolbar) view.findViewById(R.id.fragment_toolbar); 
     toolbar.setTitle("Dialog Title"); 
     toolbar.setNavigationIcon(getResources().getDrawable(R.drawable.ic_arrow_back_white)); 
     toolbar.setNavigationOnClickListener(new View.OnClickListener() { 
      @Override 
      public void onClick(View v) { 
       getActivity().getSupportFragmentManager().popBackStack(); 
      } 
     }); 
     return view; 
    } 
} 

Я рекомендовал бы использовать активность для диалога вместо присоединения диалогового фрагмента к просмотру, особенно если вы планируете поместить ввода текста в диалоговом окне. Я испытал некоторое нечетное поведение с анимацией и мягкой клавиатурой при использовании фрагмента для диалога. Создание новой операции разрешило все эти проблемы.