前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >高仿微信聊天界面长按弹框样式

高仿微信聊天界面长按弹框样式

作者头像
AndroidTraveler
发布2018-08-31 10:52:31
1.1K0
发布2018-08-31 10:52:31
举报
文章被收录于专栏:AndroidTraveler

效果图

背景

在公司做的项目里面,刚好有需要用到微信聊天界面长按弹框样式这种UI的。

网上找了一下,没找到。

Android现成的 ListPopupWindow又不能满足需求。

因此在非上班时间撸一个出来,供大家使用。

示例代码

关键文件、示例代码及使用方法等我都放到github上了。

这篇文章就不展开说明了。

这篇文章重点说明下怎么把这个样式给撸出来的。

说明一些关键点。

让大家知其然,更加知其所以然。

关键代码解剖

PopupWindow默认宽高设置

我们知道,创建PopupWindow时可以指定显示的宽度和高度。

这边说下代码里面默认的宽高是如何设置的。

默认宽度=设备的宽度/3。

默认高度的设置就比较麻烦一点。

因为高度如果设置过少,可能显示的列表Item数目就会比较少。

如果设置过大,可能显示列表会撑满整个屏幕。

基于此,这边代码设置的默认高度是动态变化的。

变化算法如下:

最大默认高度=设备的高度/2。 列表高度=Item高度*Item数目。 如果列表高度<最大默认高度,默认高度=列表高度。 如果列表高度>最大默认高度,默认高度=最大默认高度。

至于Item高度如何计算,示例代码里面有,这边就不赘余阐释了。

PopupWindow显示位置确定

在说明显示位置之前,我们先来简单说下android的坐标系。

上面的图片简单画了一下,主要是说明

X轴方向,往右边X值变大。 Y轴方向,往下面Y值变大。

这个对于后面显示位置的计算有用。

接下来我们说下显示位置的,既然是一个位置,那么就会有两个维度值。

X轴(水平方向)

Y轴(竖直方向)

除了维度值,还有一个基准点,这里的基准点就是列表的左上角。

为了说明该PopupWindow适应各个位置,所以效果图里面有三个按钮,分别位于左下角,中间,右上角。

X坐标位置确定

由上图我们可以得出结论。

当显示的View在左边时,显示的X坐标=View的中心点X坐标。 当显示的View在右边时,显示的X坐标=View的中心点X坐标-PopupWindow宽度。

Y坐标位置确定

由上图我们可以得出结论。

当显示的View在上边时,显示的Y坐标=View的中心点Y坐标。 当显示的View在下边时,显示的Y坐标=View的中心点Y坐标-PopupWindow高度。

好了,到此高仿微信聊天界面长按弹框样式的代码剖析就结束了。

点击?阅读原文前往github查看具体代码。

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2018-05-07,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 安卓小煜 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 效果图
  • 背景
  • 示例代码
  • 关键代码解剖
    • PopupWindow默认宽高设置
      • PopupWindow显示位置确定
      领券
      问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档