web-dev-qa-db-fra.com

DialogFragment plein écran avec StatusBar translucide

J'ai un DialogFragment que je veux montrer en plein écran. Je veux cependant toujours un StatusBar présent et les boutons matériels en bas. Je souhaite également définir une couleur d'arrière-plan de la StatusBar (pour Lollipop).

Mon problème est que si je définis les indicateurs suivants dans le DialogFragment:

getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);   
getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

Les claviers StatusBar et Matériel deviennent tous deux translucides et le DialogFragment s'étend derrière ceux-ci.

Voici le code qui a été grandement réduit pour devenir lisible:

public class CardDetailsDialog extends DialogFragment {

Setup parameters...

public static CardDetailsDialog newInstance(final long cardId, final long projectId){
    CardDetailsDialog frag = new CardDetailsDialog();
    frag.setStyle(DialogFragment.STYLE_NORMAL, R.style.CardDetailsDialogStyle);
    return frag;
}

@Override
public void onActivityCreated(Bundle savedInstanceState) {
    super.onActivityCreated(savedInstanceState);
    if(getDialog() != null) {
        getDialog().getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
        getDialog().getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        getDialog().getWindow().getAttributes().windowAnimations = R.style.DialogSlideAnimation;
        getDialog().getWindow().setLayout(LinearLayout.LayoutParams.MATCH_PARENT,
                LinearLayout.LayoutParams.MATCH_PARENT);
        getDialog().getWindow().setStatusBarColor(Color.RED);
    }
}

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setHasOptionsMenu(true);
}

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

    Handle everything that happens inside the view...

    return view;
}
}

Voici le thème référé:

<style name="CardDetailsDialogStyle" parent="@style/Theme.AppCompat.Light.Dialog" >
    <item name="Android:windowBackground">@null</item>
    <item name="Android:windowNoTitle">true</item>
    <item name="Android:windowFrame">@null</item>
    <item name="Android:windowIsFloating">true</item>
    <item name="Android:windowContentOverlay">@null</item>
    <item name="Android:windowAnimationStyle">@Android:style/Animation.Dialog</item>
    <item name="Android:windowSoftInputMode">stateUnspecified|adjustPan</item>
</style>

Et le style du fragment:

<RelativeLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:background="@color/pp.whiteBackgroundColor" >

<Android.support.v7.widget.Toolbar xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:id="@+id/card_details_toolbar"
    Android:layout_height="wrap_content"
    Android:layout_width="match_parent"
    Android:layout_alignParentTop="true"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/PopupMenutheme">
</Android.support.v7.widget.Toolbar>

    <ScrollView
        Android:id="@+id/details_scrollview"
        Android:layout_height="wrap_content"
        Android:layout_width="match_parent">

        All subview elements here...

    </ScrollView>

</RelativeLayout>

Voici le résultat: Screenshot

Comme vous pouvez le constater, la barre d'outils s'étend sur la barre d'état et les boutons matériels. Je ne sais pas si j'approche cela correctement. Est-ce que je manque quelque chose?

MODIFIER

C’est ce que la même vue a l’air quand je retire

getDialog().getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);

enter image description here

15
pnit

Essayez d'utiliser le même style depuis votre application. J'ai testé avec un dialogue simple sans fragment et fonctionne bien. Comme ça:

new Dialog(context, R.style.CardDetailsDialogStyle);
5
tiagotoxa

Pour ceux qui ont toujours ce problème, procédez comme suit. Cela résout simplementla moitié du problème signalé, c'est-à-dire une barre d'état noire _

Ajouter le thème suivant àres/value-v21/style

<style name="DialogTheme" parent="@style/Base.Theme.AppCompat.Light.Dialog">
     <item name="Android:windowTranslucentStatus">true</item>
</style>

Et ensuite, appliquez Style sur DialogFragment dans onCreate

@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setStyle(DialogFragment.STYLE_NO_TITLE, R.style.DialogTheme);
}

Edit Si vous avez des problèmes avec votre thème de dialogue, utilisez ce style, par exemple. colorAccent ou colorControlHighlight etc 

<style name="DialogTheme" parent="@style/ThemeOverlay.AppCompat.Dialog">
     <item name="Android:windowTranslucentStatus">true</item>
</style>

 enter image description here

2
Noman Rafique

Vous devez définir fitsystemwindows = true. Une autre méthode consiste à ajouter un espace avec 0dp et de modifier sa hauteur à 25dp lorsque la boîte de dialogue va s'afficher.

Pour changer la taille de l’espace, utilisez les paramètres d’agencement, consultez ce post: Comment créer un RelativeLayout par programme avec deux boutons superposés?

2

Dans mon cas, SYSTEM_UI_FLAG_LAYOUT_STABLE a résolu le problème de chevauchement 

        int width = ViewGroup.LayoutParams.MATCH_PARENT;

        int height = ViewGroup.LayoutParams.MATCH_PARENT;

        dialog.getWindow().setLayout(width,height);

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Lollipop) {
            dialog.getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
            dialog.getWindow().setStatusBarColor(getResources().getColor(R.color.darkGrayTransp));
            dialog.getWindow().getDecorView().setSystemUiVisibility(SYSTEM_UI_FLAG_LAYOUT_STABLE);//solves issue with statusbar
            dialog.getWindow().setGravity(Gravity.CENTER_HORIZONTAL| Gravity.TOP);
        }
2
adray
<style name="DialogTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="Android:windowTranslucentStatus">true</item>
        <item name="Android:windowNoTitle">true</item>
        <item name="Android:windowFullscreen">true</item>
        <item name="Android:windowIsFloating">false</item>
    </style>
0
Chhaya