继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

Dialog的高冷用法

Coley_5
关注TA
已关注
手记 86
粉丝 8548
获赞 6550

新的一年开始了,打开朋友圈、QQ空间、微博,一大波虐狗了,晒图的,炫富的又开始了,今天就带大家做这样一个图文小案例。先看下效果。
列表预览页

图片详情页

业务需求很简单,做一个小图预览,然后点击某个小图,进入大图查看,并且能够左右滑动查看图片。
实现思路也很简单,小图预览页面可以用GridView+ImageView,再为GridView添加onItemClickListener即可,这里没有什么好说了。大图查看也很简单,跳转一个Activity或者Fragment,把资源Id或者图片Url传递过去,再用ViewPager显示即可。但如果真的这样做的话,就和我们今天的主题半毛钱关系都没有了。我们现在重新看下需求,列表展示页没什么好说的,关键是在大图预览界面,我们可以看到,在大图查看页,我们只提供了一个功能,查看一个ImageView。使用Activity的话未免有点太大材小用了,而且还需要需要在配置文件中注册,太麻烦。使用Fragment貌似要稍微好点,但还是显得有点笨重,但相对于Activity来会好很多,但对于这样简单的需求来说,还是显得麻烦,不够轻便。我们最终的选择就是今天的主角Dialog。

    public void setContentView(int layoutResID) {
        mWindow.setContentView(layoutResID);
    }

查看Dialog的源码,我们看到一个熟悉的方法,setContentView(); 这就让问题变的简单了,现在我们只需要自定义一个Dialog,传入我们的布局文件,然后再把这个Dialog设置成全屏的模拟成一个Activity即可

package hi.xiaoyu.hi_xiaoyu_dialog.ui;

import hi.xiaoyu.hi_xiaoyu_dialog.R;
import hi.xiaoyu.hi_xiaoyu_dialog.adapter.CommonPageAdapter;

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

import android.app.Dialog;
import android.content.Context;
import android.graphics.Rect;
import android.support.v4.view.ViewPager;
import android.util.DisplayMetrics;
import android.view.View;
import android.view.ViewGroup.LayoutParams;
import android.widget.ImageView;

public class ImgScanHelper extends Dialog implements
        android.view.View.OnClickListener {

    private List<String> mListImgUrls;
    private Integer[] mImgIds;
    private Context mContext;
    private ViewPager mViewPager;
    private int mClickItem;

    public ImgScanHelper(Context context, Integer[] imgIds, int clickItem) {
        // 设置自定义样式
        super(context, R.style.CustomDialog_fill);
        this.mContext = context;
        this.mImgIds = imgIds;
        this.mClickItem = clickItem;
        initView();
    }

    public ImgScanHelper(Context context, List<String> imgUrlss, int clickItem) {
            // 设置自定义样式
        super(context, R.style.CustomDialog_fill);
        this.mContext = context;
        this.mListImgUrls = imgUrlss;
        this.mClickItem = clickItem;
        initView();
    }

    private void initView() {
        mViewPager = new ViewPager(mContext);
        LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT,
                LayoutParams.MATCH_PARENT);
        mViewPager.setLayoutParams(params);
        mViewPager.setBackgroundColor(0xFF000000);
        setContentView(mViewPager);
        setParams();
        initViewPager();
    }

    private void setParams() {
        LayoutParams lay = this.getWindow().getAttributes();
        DisplayMetrics dm = new DisplayMetrics();
        this.getWindow().getWindowManager().getDefaultDisplay().getMetrics(dm);
        Rect rect = new Rect();
        View view = getWindow().getDecorView();
        view.getWindowVisibleDisplayFrame(rect);
        lay.height = dm.heightPixels - rect.top;
        lay.width = dm.widthPixels;
    }

    private void initViewPager() {
        if (mImgIds != null && mImgIds.length > 0) {
            List<View> listImgs = new ArrayList<View>();
            for (int i = 0; i < mImgIds.length; i++) {
                ImageView iv = new ImageView(mContext);
                LayoutParams params = new LayoutParams(
                        LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
                iv.setLayoutParams(params);
                listImgs.add(iv);
                iv.setOnClickListener(this);
                iv.setImageResource(mImgIds[i]);
                // 加载网络图片
                // BitmapHelper.getInstance(mContext).display(iv,
                // mListImgUrls.get(i));
            }
            if (listImgs.size() > 0) {
                CommonPageAdapter pageAdapter = new CommonPageAdapter(listImgs);
                mViewPager.setAdapter(pageAdapter);
                mViewPager.setCurrentItem(mClickItem);
            }
        }
    }

    @Override
    public void onClick(View v) {
        this.dismiss();
    }

    @Override
    public void dismiss() {
        super.dismiss();

    }

}
  <style name="CustomDialog_fill" parent="@android:Theme.Dialog">
        <item name="android:windowFrame">@null</item>
        <item name="android:windowIsFloating">true</item>
        <item name="android:windowIsTranslucent">true</item>
        <item name="android:windowNoTitle">true</item>
        <item name="android:backgroundDimEnabled">false</item>
        <item name="android:windowBackground">@color/white</item>
    </style>

一行代码实现了大图预览

new ImgScanHelper(MainActivity.this, mImgsIds, position).show();
这里我们是将Dialog模拟成一个Activity,实现了大图查看的功能需求。其实当我们遇到一些比较简单的需求页面,或者说一个功能需要拆散成借个页面的时候,我们使用Dialog模拟Activity的方式来实现,会使得代码更加简介明了。而且复用性极高,比如上面的图片预览功能,可以轻松移植到任何地方。
总结:Dialog模拟Activity适用于一些轻量级的功能模块,比如一些帮助功能,头像查看,图片预览等等一些不需要考虑生命周期的操作,如果你需要在Activity异常销毁时,进行一些数据存储操作,还是多花点时间写一个Activity或者Fragment。相对于Activity和Fragment来说,Dialog不需要在配置文件中注册,没有Fragment那么多麻烦的生命周期,如果你的UI界面不需要考虑生命周期带来的问题,Dialog几乎可以实现和Activity一模一样的功能。如果你需要和Activity进行通信的话也很简单,因为Dialog中持有Activity的引用,你可以通过接口回调,广播通知等方式进行通信。同样你也可以抽取一个BaseDialog,进行代码的抽取,能极大的提高你的开发效率。希望你能从此爱上Dialog !o(∩_∩)o
本文为慕课网原创作者创作,欢迎任何形式的转载。 为了尊重原创作者,转载请标明【原文作者及慕课网原文地址】信息。谢谢!
打开App,阅读手记
6人推荐
发表评论
随时随地看视频慕课网APP

热门评论

CommonPageAdapter在哪

查看全部评论