Android全屏对话框显示为透明且位置错误

时间:2015-06-24 07:34:50

标签: android material-design android-dialogfragment

我试图在我的Android应用程序中添加一个对话框,该对话框在小型设备(例如手机)上是全屏的,但在大型设备(例如平板电脑)上是标准对话框。这遵循material design specification中列出的逻辑。

使用official android dialog guide,使用DialogFragment,我最终得到一个覆盖操作栏的透明对话框:

enter image description here

以下是源代码。

main.xml中

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    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.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 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.AppBarLayout>
    </android.support.design.widget.CoordinatorLayout>

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

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:layout_margin="10dp"
        android:src="@drawable/ic_add"
        android:clickable="true"/>

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

MainActivity.java

package com.example.fsdialog;

import android.os.Bundle;
import android.support.design.widget.FloatingActionButton;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.app.ActionBar;
import android.support.v7.widget.Toolbar;
import android.view.View;

public class MainActivity extends AppCompatActivity
{

    /** Called when the activity is first created. */
    @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);
        }

        final ActionBar ab = getSupportActionBar();
        ab.setHomeAsUpIndicator(R.drawable.ic_menu);
        ab.setDisplayHomeAsUpEnabled(true);

        // FAB
        FloatingActionButton fab = (FloatingActionButton) findViewById(
                R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                FragmentManager fm = getSupportFragmentManager();
                MyDialogFragment dialog = new MyDialogFragment();

                if (false) {
                    // The device is using a large layout, so show the fragment
                    // as a dialog
                    dialog.show(fm, "MyDialogFragment");
                } else {
                    // The device is smaller, so show the fragment fullscreen
                    FragmentTransaction tx = fm.beginTransaction();
                    tx.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN);

                    // To make it fullscreen, use the 'content' root view as
                    // the container for the fragment, which is always the root
                    // view for the activity
                    tx.add(R.id.content, dialog)
                      .addToBackStack(null).commit();
                }

            }
        });
    }

}

my_dialog.xml

<?xml version="1.0" encoding="utf-8"?>
<GridLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:rowCount="2"
    android:columnCount="2">

    <TextView
        android:id="@+id/text_date1"
        android:layout_row="0"
        android:layout_column="0"
        android:text="17/06/2015"
        style="@android:style/Widget.Holo.Spinner"/>
    <TextView
        android:id="@+id/text_time1"
        android:layout_row="0"
        android:layout_column="1"
        android:text="09:35"
        style="@android:style/Widget.Holo.Spinner"/>
    <TextView
        android:id="@+id/text_date2"
        android:layout_row="1"
        android:layout_column="0"
        android:text="17/06/2015"
        style="@android:style/Widget.Holo.Spinner"/>
    <TextView
        android:id="@+id/text_time2"
        android:layout_row="1"
        android:layout_column="1"
        android:text="11:00"
        style="@android:style/Widget.Holo.Spinner"/>

</GridLayout>

MyDialogFragment.java

package com.example.fsdialog;

import android.app.Dialog;
import android.os.Bundle;
import android.support.v4.app.DialogFragment;
import android.view.View;
import android.view.ViewGroup;
import android.view.LayoutInflater;
import android.view.Window;

public class MyDialogFragment
    extends DialogFragment
{
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        return inflater.inflate(R.layout.my_dialog, container, false);
    }

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {
        Dialog dialog = super.onCreateDialog(savedInstanceState);
        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
        return dialog;
    }
}

的AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="com.example.fsdialog"
      android:versionCode="1"
      android:versionName="1.0">
    <application android:label="@string/app_name"
                 android:icon="@drawable/ic_launcher">
        <activity android:name="MainActivity"
                  android:label="@string/app_name"
                  android:theme="@style/Theme.AppCompat.NoActionBar">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

更新1(2015年6月24日)

我现在正在使用android Theme.AppCompat.NoActionBar主题,并在主要活动中有FrameLayout。我仍然遇到同样的问题(图像更新)。

  • 我认为内置主题将包含对话框的背景颜色是不对的?你知道,一个理智的默认?我肯定知道,如果我只是以正常的方式显示对话框,它会获得背景颜色。
  • 我假设我添加的CoordinatorLayout导致对话框覆盖操作栏,即使我使用嵌入式FrameLayout。这是为什么?我需要CoordinatorLayout,因此FloatingActionButton位于正确的位置。

1 个答案:

答案 0 :(得分:1)

@cutoff是对的。我的更新失败了,因为根布局是CoordinatorLayout而不是LinearLayout或同样好的东西。以下示例使用DrawerLayout

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_layout"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:fitsSystemWindows="true">

    <LinearLayout
        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.AppBarLayout>
        </android.support.design.widget.CoordinatorLayout>

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

    </LinearLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_height="match_parent"
        android:layout_width="wrap_content"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/nav_view"/>

</android.support.v4.widget.DrawerLayout>

有关此解决方案的更多详细信息,请参阅this question,其中包括DialogFragment除了完全全屏之外的其他内容不足的原因。