自定义dialog的宽度充满整个屏幕宽度的问题

最新推荐文章于 2024-03-28 18:42:45 发布
原创 最新推荐文章于 2024-03-28 18:42:45 发布 · 置顶 · 1.5w 阅读 · 16 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
标签
#自定义dialog
本文详细解释了如何在Android应用中自定义dialog的宽度，使其完全匹配手机屏幕宽度，通过深入分析dialog构造函数及主题配置，提供了解决方案及修改示例。

最近在实现一个自定义dialog的时候，效果要求自定义dialog的宽度必须跟手机屏幕的宽度一样宽。

自定义dialog：

public class CustomDialog extends Dialog{

    private Context mContext;

    public CustomDialog(Context context) {
        super(context);
        this.mContext = context;
        View view = getLayoutInflater().inflate(R.layout.dialog_quick_option2, null);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        super.setContentView(view);
    }

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);
        getWindow().setGravity(Gravity.BOTTOM); //显示在底部

        WindowManager m = getWindow().getWindowManager();
        Display d = m.getDefaultDisplay();
        WindowManager.LayoutParams p = getWindow().getAttributes();
        p.width = d.getWidth(); //设置dialog的宽度为当前手机屏幕的宽度
        getWindow().setAttributes(p);
    }
}

自定义dialog布局dialog_quick_option2.xml ：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:background="#f6f6f6">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dp"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center_horizontal"
                android:padding="18dp"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="48dp"
                    android:layout_height="48dp"
                    android:src="@drawable/quick_option_text_nor"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp"
                    android:textSize="12dp"
                    android:gravity="center"
                    android:text="你好"/>
            </LinearLayout>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center_horizontal"
                android:padding="18dp"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="48dp"
                    android:layout_height="48dp"
                    android:src="@drawable/quick_option_text_nor"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp"
                    android:textSize="12dp"
                    android:gravity="center"
                    android:text="你好"/>
            </LinearLayout>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center_horizontal"
                android:padding="18dp"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="48dp"
                    android:layout_height="48dp"
                    android:src="@drawable/quick_option_text_nor"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp"
                    android:textSize="12dp"
                    android:gravity="center"
                    android:text="你好"/>
            </LinearLayout>

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center_horizontal"
                android:padding="18dp"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="48dp"
                    android:layout_height="48dp"
                    android:src="@drawable/quick_option_text_nor"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp"
                    android:textSize="12dp"
                    android:gravity="center"
                    android:text="你好"/>
            </LinearLayout>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center_horizontal"
                android:padding="18dp"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="48dp"
                    android:layout_height="48dp"
                    android:src="@drawable/quick_option_text_nor"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp"
                    android:textSize="12dp"
                    android:gravity="center"
                    android:text="你好"/>
            </LinearLayout>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center_horizontal"
                android:padding="18dp"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="48dp"
                    android:layout_height="48dp"
                    android:src="@drawable/quick_option_text_nor"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp"
                    android:textSize="12dp"
                    android:gravity="center"
                    android:text="你好"/>
            </LinearLayout>

        </LinearLayout>

    </LinearLayout>
</RelativeLayout>

最终效果：

这里写图片描述

从上图看，我们要求的自定义dialog的宽度没有到达我们手机屏幕的宽度。那咋们跟踪代码看看，首先看看咋们继承的dialog的构造函数：

Dialog(@NonNull Context context, @StyleRes int themeResId, boolean createContextThemeWrapper) {
        if (createContextThemeWrapper) {
            if (themeResId == 0) {
                final TypedValue outValue = new TypedValue();
                context.getTheme().resolveAttribute(R.attr.dialogTheme, outValue, true);
                themeResId = outValue.resourceId;
            }
            mContext = new ContextThemeWrapper(context, themeResId);
        } else {
            mContext = context;
        }

        mWindowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);

        final Window w = new PhoneWindow(mContext);
        mWindow = w;
        w.setCallback(this);
        w.setOnWindowDismissedCallback(this);
        w.setWindowManager(mWindowManager, null, null);
        w.setGravity(Gravity.CENTER);

        mListenersHandler = new ListenersHandler(this);
    }

这块代码中在第5行有使用一个主题context.getTheme().resolveAttribute(R.attr.dialogTheme, outValue, true);
咋们可以全局搜索ctrl+h一下dialog默认的主题dialogTheme
这里写图片描述

咋们一层一层跟进去看看，这里有一个默认配置的属性：

<item name="android:windowBackground">@drawable/abc_dialog_material_background_dark</item>

再次跟进这个属性里面看看，如下：

<?xml version="1.0" encoding="utf-8"?>
<!-- Copyright (C) 2014 The Android Open Source Project

     Licensed under the Apache License, Version 2.0 (the "License");
     you may not use this file except in compliance with the License.
     You may obtain a copy of the License at

          http://www.apache.org/licenses/LICENSE-2.0

     Unless required by applicable law or agreed to in writing, software
     distributed under the License is distributed on an "AS IS" BASIS,
     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
     See the License for the specific language governing permissions and
     limitations under the License.
-->

<inset xmlns:android="http://schemas.android.com/apk/res/android"
       android:insetLeft="16dp"
       android:insetTop="16dp"
       android:insetRight="16dp"
       android:insetBottom="16dp">
    <shape android:shape="rectangle">
        <corners android:radius="2dp" />
        <solid android:color="@color/background_floating_material_dark" />
    </shape>
</inset><!-- From: file:/usr/local/google/buildbot/src/googleplex-android/mnc-supportlib-release/frameworks/support/v7/appcompat/res/drawable/abc_dialog_material_background_dark.xml -->

可以看到
android:insetLeft=”16dp”
android:insetTop=”16dp”
android:insetRight=”16dp”
android:insetBottom=”16dp”
这段代码其实就是咋们为什么设置了自定义dialog的宽度为当前手机屏幕的宽度，但是最终显示的效果却没有达到我们需求的原因了。显示的背景宽度距离手机屏幕的左右两边各有16dp的间隔。所以如果要想实现之前的效果需求，咋们可以重新定义主题。修改
android:windowBackground属性的配置。

下面我就直接列出大体代码和最终效果图：


public class CustomDialog extends Dialog{

    public CustomDialog(Context context) {
        //重写dialog默认的主题
        this(context, R.style.quick_option_dialog);
    }

    public CustomDialog(Context context, int themeResId) {
        super(context, themeResId);
        View convertView = getLayoutInflater().inflate(R.layout.dialog_quick_option, null);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(convertView);
    }

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);
        getWindow().setGravity(Gravity.BOTTOM); //显示在底部

        WindowManager m = getWindow().getWindowManager();
        Display d = m.getDefaultDisplay();
        WindowManager.LayoutParams p = getWindow().getAttributes();
        p.width = d.getWidth(); //设置dialog的宽度为当前手机屏幕的宽度
        getWindow().setAttributes(p);
    }
}

重写默认主题并修改android:windowBackground属性：

<style name="quick_option_dialog" parent="@style/Theme.AppCompat.Dialog">
        <item name="android:windowBackground">@color/white40</item>
</style>

最终修改的效果：
这里写图片描述

源码下载

Android实践-自定义dialog从屏幕底部弹出并且充满屏幕宽度
热门推荐
阿拉灯神灯的专栏
07-06 1万+
通常我们使用dialog的时候会遇到一些问题，比如我想用自己定义的布局来替代系统那个黑乎乎的布局时我要怎么做？我想要指定dialog从底部弹出而不是在屏幕中央弹出要怎么做？我设置了dialog布局的宽度为填充父窗体然而实际效果却不是充满全屏的，这时我该怎么做？
干货，关于自定义Dialog的宽度充满屏幕的方法以及为什么设置失败(扩展：自定义Dialog形状)
yangyang的博客
09-20 7326
为了让自定义dialog的宽度充满屏幕，可能会在网上搜了各种各样的方法来实现这一目的，可能都失败了，这是为什么呢？因为自定义布局加载的位置不对,直接看图： 因为是在代码里面设置的dialog宽度全屏，而不是在styles里面，所以不能在创建dialog的时候加载自定义的布局，怎么实现Dialog的宽度全屏？为了清晰明了，贴图： 为了让dialog宽度全屏，在你dialog.sh
自定义dialog 默认的显示位置是window 的位置
qq_41675150的博客
12-24 1551
我们可以通过dialog或者窗口对象 window 然后通过window 去设置dialog的上下中的位置   例如 dialog.getWindow(); 得到window对象  window.setGravity(Gravity.CENTER); 中间位置  window.setGravity(Gravity.BOTTEM); 底部位置  window.setGravity(Grav...
Android Dialog 设置窗体背景颜色以及宽高
zfr930102的博客
07-12 4382
dialog.getWindow().setBackgroundDrawableResource(android.R.color.transparent);设置窗体背景透dialog.getWindow().setGravity(Gravity.BOTTOM);设置出现的位置 设置当前窗体的大小 dialog.getWindow().setBackgroundDrawableResource(a...
Android自定义Dialog以及横竖屏切换时动态更改大小
七月的南方博客
03-28 4783
1.需求：应用中需要用到的Dialog的场景：提示用户信息并需要用户做出选择。 比如： 返回键退出提示，让用户确认是否退出。 当前网络提示，让用户确认是否网络异常，是否继续使用移动网络。 是否清空某些信息，让用户根据提示并确认当前操作是否继续。 提示用户输入密码等相关信息的底部提示框。 2.封装Dialog ①需要设置的基本属性：layout布局、宽、高、风格、是否可点击dialog以外的区域、点...
Android中利用Activity自定义背景透明、大小和位置Dialog
Liu_LongPo的专栏
11-16 4746
1.自定义Activity显示样式 先在res/values下建colors.xml文件，写入：
自定义Dialog（三）－－类似一个activity
liuye066的专栏
04-13 312
项目要求： 弹出一个dialog对话框，显示能折叠的树形列表。 TypeDialog.java public class TypeDialog extends Dialog { private static final String TAG = "TypeDialog"; private Button btn_cancel,btn_confirm; pri...
记录一次自定义Dialog的外边距问题
weixin_43104619的博客
12-04 2677
在自定义Dialog中，不管怎么设置外边距，最后都充满了屏幕 关键的地方就是这里。将window的width设置成了match。如果将这里删除或者设置成wrap，那么在上方设置的dialog的params就算设置成match也就只能包裹内容，这时候需要重新设置dialog的params的width 这样的话最后就会对左右两边有60的边距。这里只是随便写写，实际情况可以转换成dp。 ...
Android之DialogFragment宽度充满屏幕
行云间
01-11 1万+
项目中，用DialogFragment提示对话框时，公司UI非得把对话框宽度充满屏幕并在屏幕底部，折腾了半天才搞定。在DialogFragment都是默认有一定的padding,但是在API里并没有设置方法。查了半天资料都是AlerDialog设置宽度充满屏幕，DialogFragment的寥寥无几，解决之余记录下来。如果碰到同样的问题，可以参考。 1.重写onCreate方法设置Fragmen
底部弹出自定义Dialog
anroidyanyou的博客
10-13 502
> public class MainActivity extends Activity implements PhotoDialogListner{     private MainActivity mContext;     @Override     protected void onCreate(Bundle savedInstanceState) {         sup
关于自定义Dialog更改其在window展现位置
xingnan4414的博客
03-14 798
预期实现一个如下的Dialog 使用一下代码更改Dialog的位置 private void updateDialog() { WindowManager.LayoutParams attributes = getWindow().getAttributes(); getWindow().setGravity(Gravity.BOTTOM|Gravity...
鸿蒙开发之ArkUI组件常用组件-CustomDialog/Video
iOSbird的博客
03-28 1682
使用@CustomDialog装饰器装饰自定义弹窗@CustomDialog装饰器用于装饰自定义弹窗，此装饰器内进行自定义内容build() {Column() {Text("这是弹窗")Text("这是自定义弹窗的内容。。。。")创建构造器，与装饰器呼应相连})点击与onClick事件绑定的组件使弹窗弹出Row() {Button('显示弹窗')})
Android 关于设置Dialog大小宽高和动画详解
Android爬坑牛奶糖的博客
01-08 1万+
近期有的小伙伴需要对Dialog设置一些属性，例如它的宽高，是否全屏，位置，包括动画等，我最近的项目中刚好用到了这些，下面就将这些功能贴出来分享给大家 设置dialog对象的宽高 public void setDialogWidthAndHeight(Dialog dialog,int widthDp,int heightDp){ WindowManager wm = (Windo...
android dialog设置宽度占满屏幕的可靠方法
每天学习一点点，每天记录一点点
03-05 6850
将Android Dialog宽度设置为屏幕宽度的两部方法，绝对可靠
Dialog显示宽度铺满屏幕宽度的设置
dandan的专栏
08-22 7654
在项目中，弹出分享面板时，觉着使用Dialog比使用Popuwindow更好，所以使用Dialog弹出分享的面板，但是发现在小米Note3手机上，弹出的dialog的宽度老是和屏幕的宽度有一些距离，高度也是。 在搜索使用了百度和google上的大部分代码测试之后，发现还是没有解决问题。。。终于让我看到一篇博客。。。。彻底解决了这个问题。。。但是那个博客我忘记收藏了。。。SORRY！ 所以写下来代
设置自定义Dialog的宽高
T丶快乐知己丬
04-15 4537
前言 我们在自定义dialog时，在使用LayoutInflater.from(context).inflate(layoutId,null)填充布局时，无论layoutId跟布局设置的宽高是多少，最后显示的都是包裹内容。 自定义Dialog布局宽高： 方法一： 设置dialog的window对象attribute属性(注意：这里必须放到dialog.show()之后，否则没效果) final...
Android 自定义布局的dialog宽高变形问题
残风乱了温柔的博客
03-31 3245
这几天在做自定义布局的dialog时，踩了不少的坑，现在记录下自认为最大的坑。 首先，我们来创建一个定义dialog布局的xml文件。dlg_test.xml： <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/andr...
Dialog设置宽高问题
woaichihuoguoguo的博客
03-16 1万+
最近在做需求的时候，由于有大量的弹窗，所以基本上弹窗都使用了Dialog进行实现。但是没想到Dialog真难用啊。最令人崩溃的就是它的宽高问题了，Dialog会忽视根布局中的宽高设置，最终宽度会由Dialog的style中的android:windowMinWidthMinor属性决定，高度会表现为wrap_content，所以说在根布局中设置宽高是没有用的，而这个属性也往往不能满足我们的需求，下面我根据不同的情况写一下如何设置Dialog的宽高。 一、Dialog宽高固定 刚刚提到，由于根布局的宽高属
Android 自定义dialog 设置宽度的问题
onlySound的博客
03-16 5491
自定义弹框效果图 首先在自定义布局文件中设置了宽度，但是不起作用 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/bg_dialog" > <!--@draw
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值