首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Android点九图总结以及在聊天气泡中的使用

点九图介绍 这一块是对点九图的简单介绍,如果对这块已经有了解的话,可以直接跳到2,看看聊天气泡中如何使用点九图。...在ios开发中,可以在代码中指定某个点进行拉伸,而在Android中不行,所以在Android中想要达到这个效果,只能使用点九图。...再看看上面1.5的解析原理,它会带来一个坑,由于聊天气泡需求需要使用url从网络上拉取点九图,如果这个点九图没有经过编译的过程,将其周围的黑线标记放入到png中的一个辅助chunk中,那么在使用这个图作为背景时...接下来说说这9个步骤中的遇到问题: 步骤2中,给9点图画黑线,必须是纯黑色像素,且图片的四个角必须为透明像素点,否则Android会无法识别,且在步骤3中将无法转换。...这里的mNinePatchChunk信息,实际上是在编译时,编译器将png图片中四周黑线所代表的信息解析成Res_png_9patch,存放到png的一个数据块中,然后j将tag设置为“npTc”,接着在使用时

5.8K42

Android 点九图机制讲解及在聊天气泡中的应用

在ios开发中,可以在代码中指定某个点进行拉伸,而在Android中不行,所以在Android中想要达到这个效果,只能使用点九图(下文会啪啪打脸,其实是可以的,只是很少人这样使用,兼容性不知道怎么样,点击跳转...标记位置 含义 左-黑点 纵向拉伸区域 上-黑点 横向拉伸区域 右-黑线 纵向显示区域 下-黑线 横向显示区域 ---- 点九图在 Android 中的应用 点九图在 Android 中主要有三种应用方式...直接放在 res 目录中的 drawable 或者 mipmap 目录中 放在 assert 目录中 从网络下载 第一种方式是我们最常用的,直接调用 setBackgroundResource 或者...因此,在 Android 中,我们如果想动态使用网络下载的点九图,一般需要经过以下步骤: 使用 sdk 目录下的 aapt 工具将点九图转化为 png 图片 解析图片的时候,判断是否含有 NinePatchChunk...注意: 若不是标准的点九图,在转换的过程会报错,这时候请设计重新提供新的点九图 ---- 实际开发当中遇到的问题 小屏手机适配问题 刚开始,我们的切图是按照 2 倍图切的,这样在小屏幕手机上会手机气泡高度过大的问题

1.4K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    前端|动态发光按钮

    问题描述 通常我们在HTML表单中使用button元素,是通过标签定义一个按钮,再在button元素内部来放置内容,动态发光按钮原理类似。...解决方案 制作动态发光按钮时,要注意以下细节: 使用background: linear-gradient标签来设置按钮颜色的渐变效果。 制作过程: (1)设置页面背景,使用背景图片填充网页。...使图片的高度height:100vh;让网页高度撑满,background标签后面加上no-repeat让背景不重复,使用background-size: cover;把背景图像扩展至足够大,让背景图像完全覆盖背景区域.../*宽度*/ height: 60px; /*高度*/ position: absolute; /*绝对定位*/ top: 50%;/*网页顶部距离...样式*/ } } (4)引入JavaScript,为按钮内气泡设置不同的高低位置和运行速度。

    2.9K30

    Xcelsius(水晶仪表)系列11——选择器高级用法(页面级切换工具)

    以上是本案例的最终效果,它是由两个页面组成的,通过顶部的切换按钮在两个页面之间进行切换,其中饼图的页面由可以通过标签式菜单在六个大区之间进行数值切换,进而使饼图呈现六个地区的不同指标情况。...本案例除了切换按钮和气泡图之外,其他的部件及统计图均有过详细讲解,因而这里重点讲解切换按钮及气泡图。 首先制作气泡图,在统计图部件中插入气泡图并打开属性设置菜单。...在气泡图统计图标题中,自拟主标题、副标题,将X轴标题链接到C1,y轴标题链接到B1单元格。 ?...切换按钮的标签需要手动设置,源数据这里也手动设置(要与你之前给饼图、气泡图,标签式菜单的动态可见性代码一致),目标数据区域链接到A25(切换按钮的输入区也就是饼图与气泡图的动态可见性状态接收区域),不过你也可以尝试在...excel表格中自己输入标签和原数据,然后通过链接的方式进行,效果是一样的。

    1K40

    地图可视化 | EXCEL中展示气泡点地图

    小O地图EXCEL版提供将EXCEL中带有经纬度坐标的数据,按点气泡的方式标注到地图上的功能,并可设置点气泡的大小、填充颜色等样式。 下面以样例数据来操作说明。...设置后点击加载数据,将表格数据加载到地图上,根据数据量大小( 建议控制在2000个点内 ),稍等片刻,地图会出现加载的气泡点。...image.png b、图层显示样式设置 进入样式设置栏,为标注在地图上的气泡点设置样式。你可以 设置所有气泡为同一样式 也可设置分组样式,按照分类或规则设置分类样式。...具体操作如下: 在样式栏中,新建四个分组样式,会出现数字标签的四个TAB页,每个代表一个分组样式。...在设置过滤条件面板里新增“过滤表达式”,通过选择创建“数组的表达式,最后点击“刷新”,地图将按表达式过滤数据。 如下图,黄色的点表示符合过滤条件的数据。其他颜色的点是其他分组样式的效果。

    1.3K10

    图表案例——网易数独经典图表仿作

    ,尽可能的将实事数据呈现为图文并茂的信息图表,这样看着更加容易被大众理解,易于阅读。...由于在Excel中气泡图不能和其它图表组合,图中所示条形图其实是用误差线仿制的。在一张图表中,实际有两组气泡,靠近Y轴的气泡被隐藏了,所以看不见。用隐藏的气泡图来做误差线。...Step 3 我们接着如上面所示的那样添加与调整另一组用来做条形图的气泡数据。在绘图区点击用来做条形图的辅助气泡,数据太小点不到的话可以格式栏来选择,然后添加误差线。...Step 8 给用来做条形图的辅助气泡添加数据标签移动到合适的位置,这时必须使用一个小插件XY ChartLabels。...也可以直接使用Excel 2016版本中的数据标签添加“自定义”选择功能实现,如图所示: ? 添加正确的数据标签: ? Step 9 后面就是各种美化工作,将其锚定在单元格上。

    3.1K40

    自己设计的Vue3的实用项目(内含对项目亮点的实现思路与介绍)

    在11月初的时候,我给自己定的目标:了解完 Vue3,然后做一个小项目 其中,Vue3 是早就学完了的,然后也写了两篇总结或是心得吧,其中有很多都是在做项目中踩出来的坑,所以大家可以看一下,避免之后开发中遇到...项目功能 && 特色 毕竟是个网址导航栏,所以功能非常的简单,但之后我会尽可能地去完善该项目的一些额外的功能 项目的功能: ✅ 标签的添加、修改、删除 ✅ 网址的添加、修改、删除 ✅ 搜索功能 ✅ 配置的导入...,把所有的 message 实力管理在一个数组中 然后我们要把其作为一个方法注册到全局中,这个我就把它放在了 App.vue 文件中,通过 Vue3 的 provide 方法暴露在全局 <template...哈哈哈,这样就成功导入文件啦~ ✔ Scroll Animation 因为我们所有的 URL 都是在一个页面内的,并且搭配着侧边栏中的按钮进行标签的跳转,即在左侧点哪个标签,右侧的内容就跳到哪个标签。...// 获取目标元素离顶部的距离(这里的80是减去了我顶部消息栏的高度,大家可以不用管) let each = start > end ?

    2.7K41

    自己设计的Vue3的实用项目(内含对项目亮点的实现思路与介绍)

    在11月初的时候,我给自己定的目标:了解完 Vue3,然后做一个小项目 其中,Vue3 是早就学完了的,然后也写了两篇总结或是心得吧,其中有很多都是在做项目中踩出来的坑,所以大家可以看一下,避免之后开发中遇到...项目功能 && 特色 毕竟是个网址导航栏,所以功能非常的简单,但之后我会尽可能地去完善该项目的一些额外的功能 项目的功能: ✅ 标签的添加、修改、删除 ✅ 网址的添加、修改、删除 ✅ 搜索功能 ✅ 配置的导入...,把所有的 message 实力管理在一个数组中 然后我们要把其作为一个方法注册到全局中,这个我就把它放在了 App.vue 文件中,通过 Vue3 的 provide 方法暴露在全局 <template...哈哈哈,这样就成功导入文件啦~ ✔ Scroll Animation 因为我们所有的 URL 都是在一个页面内的,并且搭配着侧边栏中的按钮进行标签的跳转,即在左侧点哪个标签,右侧的内容就跳到哪个标签。...// 获取目标元素离顶部的距离(这里的80是减去了我顶部消息栏的高度,大家可以不用管) let each = start > end ?

    1.2K20

    PowerBI 2020.11 月更新 - 各类图标更新及查找异常

    卡顶部的PIN KEY字段 您可以选择将表格的关键字段固定在其表格卡片的顶部。 此图像以字母顺序显示Sales表中的字段,这是Power BI中表和字段的默认顺序。...如果您打开“卡片顶部的Pin键字段”,则表格的键字段将显示在表格卡片的顶部。...在此处阅读有关工作区更新的所有信息。 更新的个人书签:以前,选择一个个人书签将使用该书签的名称更新顶部栏中的面包屑。向前移动,书签名称将在报告操作栏的上下文中内联更新。...现在,您可以控制轴标签的密度和数量。 这很重要,因为在一个典型的较小倍数中,数据标签中可能有很多冗余。现在,我们为您提供了更多选择,即仅在第一张图表中,仅在第一行或最后一行中显示标签。...以下是一些关键功能和常见客户要求: 健壮的条件格式以进行异常检测 气泡和散布的IBCS标准模板 战略用例的差异栏 数据标签定制-显示每个数据点的类别和值 分析部分–自定义线,趋势线,参考线和带 运行时选项

    8.4K30

    iOS 9人机界面指南(三):iOS 技术 (中) - 腾讯ISUX

    小气泡(badge)是一个显示未读通知数量的红色小圆(小气泡显示在应用图标的右上角)。小气泡的大小和颜色不能做修改。 横幅、警告框和小气泡这三种通知都可以使用自定义或系统提供的声音。...iAd框架的设计固定在屏幕底部时看起来效果最佳。 为了保证广告无缝植入,并且要提供最好的用户体验,可以遵循以下几点规范。 将标准横幅广告视图尽量放置在屏幕底部或底部附近。...栏 标准横幅的位置 屏幕底部没有栏 屏幕底部 屏幕任何地方都没有栏 屏幕底部 有工具栏(toolbar)或标签栏(tab bar) 底部栏的上方 将中等矩形横幅广告视图放置在不会干扰内容的地方。...用户只有在不觉得广告会打扰他们正常的工作流程时才有可能去体验iAd.这点对于游戏这样的沉浸式应用尤其重要:你肯定不想将横幅放置在影响用户玩游戏的位置。 避免将横幅放置在用户只会一扫而过的页面。...另外要注意的是,在导航视图中显示文件预览意味着允许Quick Look在导航栏上放置特定的预览控件。(如果你的视图中包含工具栏,Quick Look会将预览控件放在工具栏上。)

    3.3K50

    R可视乎|气泡图

    前两部分可见(跳转): 趋势显示的二维散点图 分布显示的二维散点图 该书对气泡图的绘制并不是非常详细,小编将内容进行了大量拓展。下面的例子将一步步带你完成气泡图的绘制。...使用ggplot2,可以通过geom_point()函数构建气泡图。aes()设定至少三个变量:x、y和size。其实就是散点图绘制的升级版吧,aes()中多了一个参数。...k可将点的透明度进行调整(geom_point(alpha=0.5)) 为了避免在图表顶部出现大的圆圈,可以将数据集进行排序(arrange(desc(pop))),代码如下。...带数据标签 这里使用ggrepel包中的(geom_text_repel()),可以给每个点自动加入标签,我这里是加入了各个国家名字,其他可以根据你实际需求进行设置。...如果不喜欢圆形的气泡图,可以将代码中的shape=21进行更改,正方形是shape=22,得到的图如下: ?

    2.2K20

    Excel揭秘19:SERIES公式

    SERIES公式控制着绘制Excel图表的数据,并且只在图表中有效,它不是真正的公式但可以像Excel公式一样在公式栏对其进行编辑。...认识SERIES公式 当你选取图表中的系列时,不仅工作表中该系列的数据会高亮显示,而且在公式栏中会显示一个公式,这个公式是你创建图表或添加系列时,Excel自动为你编写的。...X值 X值是沿图表X轴(类别轴)绘制的数字或分类标签,通常是单元格引用,如上面示例中的Sheet1!...注意,某些类型的系列将绘制在其他系列之前,例如,面积系列将绘制在所有条形/柱形系列之前、面积系列也绘制在线形系列之前,最后绘制XY散点系列。在每组图表中,所有主要系列绘制在所有次要系列之前。...图3 此外,还可以通过在公式栏中输入新的SERIES公式将新系列添加到图表中:选取图表区域,单击公式栏,输入SERIES公式。

    5.3K33

    腾讯云AI代码助手编程挑战赛-创业者青桔

    页面顶部使用了页头区域(app-header),内部放置了多个按钮,包括切换主题、下载对话、分享对话和发消息按钮。...用户在弹窗中输入消息,通过点击“发送”按钮提交消息。消息提交后: 消息被添加到聊天列表中,展现用户消息和后续的智能回复。 同时使用流式接口(SSE)获取回复数据,逐步将答案显示在对话窗口中。...功能介绍 以下是项目核心功能的详细介绍: 主题切换 顶部按钮切换主题,通过改变外层容器的 CSS 类控制背景色,满足用户在不同场景下的视觉需求。...发消息 与常规输入框不同,本项目将消息输入移至弹窗中,使用大号 textarea 提供更宽敞、便于输入的编辑区域,使得长消息或需要排版的文本内容能够更好呈现。...腾讯云 AI 代码助力 在项目开发全流程中,腾讯云 AI 助力发挥了极大作用。

    10310

    绘图软件Origin新手使用教程「建议收藏」

    绘制Y轴错位堆垒曲线图 Y轴错位堆垒曲线图将多条曲线在单个图层上从上到下堆垒并将其纵轴(y轴)做适当的错位,特别适合绘制多条包含多个峰的曲线图形。 数据要求:包含多个数值型Y列。...绘制二维瀑布( Waterfall)图 二维瀑布图将多条曲线在单个图层上按前后顺序排列并将它们向右上方做适当的错位,以便清晰地显示各曲线细微差别,特别适合绘制多条包含多个峰又极其相似的曲线图形。...绘制三角( Ternary)图 三角图主要用于描述X、Y、Z列所代表的量之间的比例关系,因此,理论上应满足X+Y+Z=1。如果数据表中的数据没有归一化,Origin在绘图时会自动归一化。...②单击菜单命令【Plot】→【Specialized】→【Zoom】或2D Graphs工具栏上的【Zoom】按钮,初步绘制结果如图所示。 ③将图层1中的放大区域选取框拖动到要放大的区域。...示例准备如下: ①导入Graphing文件夹中的3D Pie Chart.dat文件数据。 ②添加一个列,然后将B列数据复制到C列。 绘图步骤: ①选中C列将其设置为标签列。

    7.8K24

    独家 | 手把手教数据可视化工具Tableau

    注意: 有时,数据库中数据的精度比 Tableau 可以建模的精度更高。在将这些值添加到视图中时,状态栏的右侧将显示一个精度警告。 5....STEP 4:单击工具栏上的“降序排序”按钮 ( ),按从最多到最少的顺序对类别进行排序。 STEP 5: 单击工具栏上的“显示标记标签”按钮 ( ),以在视图中显示度量值。...此视图使您能深入了解您的数据,例如西部的装运模式在四年期间内发生了怎样的变化。 额外步骤:为堆叠条添加合计 将合计添加到图表中条形的顶部的操作,有时就像通过在工具栏中单击“显示标记标签”图标一样简单。...现在您的视图是完整的: STEP 11: 使用视图右侧的滚动条来检查不同地区的数据。 生成填充气泡图 使用填充气泡图可以在一组圆中显示数据。维度定义各个气泡,度量定义各个圆的大小和颜色。...STEP 6:将“Profit”(利润)拖到“标记”卡上的“颜色”中: STEP 7:将“Region”拖到“标记”卡上的“标签”以说明每个气泡所代表的内容。

    18.9K71

    可视化神器Plotly绘制气泡图

    可视化神器Plotly玩转气泡图 本文是可视化神器Plotly绘图的第6篇:将会重点讲解如何通过Plotly绘制气泡图,英文叫Bubble Charts。...首先看一段Plotly官网中对气泡图的简介: A bubble chart is a scatter plot in which a third dimension of the data is shown...气泡图是也是一种散点图。这种散点图和普通散点图的不同之处在于:它会引入第三方维度,即标记markers的大小来进行展示。在Plotly中散点的大小是通过size参数来设置 ?...改变文本显示位置 文本显示位置主要顶部top、中间middle、底部bottom,加上左中右left、center、right的组合: top left top center top right middle...气泡大小缩放Scaling the Size of Bubble Charts 有时候数据之间的大小差异较大,造成某些气泡过大,图形非常难看,需要对气泡的大小进行尺度缩放,Plotly官方有建议的公式和参数

    3K50

    java编写冒泡排序源代码,用java实现冒泡排序算法,java冒泡算法

    扫描仍是从无序区底部向上直至该区顶部。扫描完毕时,该区中最轻气泡飘浮到顶部位置R上,结果是R[1..i]变为新的有序区。  ...若在某一趟排序中未发现气泡位置的交换,则说明待排序的无序区中所有气泡均满足轻者在上,重者在下的原则,因此,冒泡排序过程可在此趟排序后终止。...为此,在下面给出的算法中,引入一个布尔量exchange,在每趟排序开始前,先将其置为FALSE。若排序过程中发生了交换,则将其置为TRUE。...5、算法改进  上述的冒泡排序还可做如下的改进:  (1)记住最后一次交换发生位置lastExchange的冒泡排序  在每趟扫描中,记住最后一次交换发生的位置lastExchange,(该位置之前的相邻记录均已有序...②造成不对称性的原因  每趟扫描仅能使最重气泡"下沉"一个位置,因此使位于顶端的最重气泡下沉到底部时,需做n-1趟扫描。  ③改进不对称性的方法  在排序过程中交替改变扫描方向,可改进不对称性。

    3.7K30

    数组排序方法(冒泡排序)

    数组排序方法--冒泡排序法 冒泡排序是排序算法中较为简单的一种,英文名为Bubble Sort。...根据轻气泡不能在重气泡之下的原则,从下往上扫描数组R:凡扫描到违反本原则的轻气泡,就使其向上"飘浮"。如此反复进行,直到最后任何两个气泡都是轻者在上,重者在下为止。 初始 R[1..n]为无序区。...第一趟扫描 从无序区底部向上依次比较相邻的两个气泡的重量,若发现轻者在下、重者在上,则交换二者的位置。...第一趟扫描完毕时,"最轻"的气泡就飘浮到该区间的顶部,即关键字最小的记录被放在最高位置R[1]上。 第二趟扫描 扫描R[2..n]。...扫描仍是从无序区底部向上直至该区顶部。扫描完毕时,该区中最轻气泡飘浮到顶部位置R上,结果是R[1..i]变为新的有序区。

    68420

    前端面试题整理

    sessionStorage用于本地存储一个会话中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。...答: 冒泡排序-----从小到大排序,存在10个不同大小的气泡,由底至上地把较少的气泡逐步地向上升,这样经过遍历一次后,最小的气泡就会被上升到顶(下标为0),然后再从底至上地这样升,循环直至十个气泡大小有序...在冒泡排序中,最重要的思想是两两比较,将两者较少的升上去.冒泡排序最坏情况的时间复杂度是O(n²) 经典排序算法 - 冒泡排序Bubble sort 使用Jquery遍历class等于lock的标签...,并将标签内容收集到一个数组中。...头 4.启用Gzip压缩文件 5.将css放在页面最上面 6.将script放在页面最下面 7.避免在css中使用表达式 8.将css, js都放在外部文件中 9.减少DNS查询 10.最小化

    1.7K21

    【To B管理端】图表设计指南

    据统计分析,在微博、微信等渠道做营销传播时,将数据用图表的形式展现会比纯文字获得更高的点击量、收藏等,也更容易被人记住,从而制造话题,提升口碑。...同时,对数据区间的划分建议在4、5段,不宜过多或过少。当数值过大时可适当缩略显示,如K、M、B等。 5.3 气泡提示 鼠标在图表区滑动时会弹出气泡显示数据点信息,便于用户挖掘更多信息,查看数据。...气泡提示的使用,往往也会伴随着辅助线和辅助点。使用气泡提示时需要注意单数据点和多数据点信息呈现的差异,当浮层中出现的数据序列不小于两组时,除了文字标签,还应视觉标记。 ?...图07 单个数据点和多个数据点 5.4 图例 图例由视觉标记和文字标签组成,视觉标记一般在颜色上与图表中数据序列相对应,而文字标签则指数据序列的类型。...在实际使用过程中,常使用到底部基线,如零基线,表示最小数值为“0”的线。 ? 图10 顶部基线和底部基线 5.6 参考线 用户设置某一个定值作为参考数据进行比较,比如设置平均数做为参考值。

    2.2K21
    领券