首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

【Flutter&Flame 游戏 - 贰贰】菜单、字体和

会有一个菜单界面,让用户选择开始游戏,或通过设置按钮来打开配置界面,对游戏进行设置。而我们知道,Flame 的 “世界” 是通过 Ticker 不断触发更新的,但往往菜单是 静态 的,不需要一直更新。...在 Flame 中展示 有时我们有显示的需求,比如暂停游戏时,显示暂停面板。不然用户不小心碰到了暂停键,有可能不知所措,显示一个界面可以更好的引导交互。...如下所示,在点击空格键时,显示:代码详见 【22/02】 image.png ---- 使用需要三步: 1.创建中的内容组件 这里和开始菜单类似,就不贴代码了,详见源码。...image.png ---- 2.通过 GameWidget 的 overlayBuilderMap 参数指定 id 和 组件内容 的映射关系: image.png ---- 3.通过 id...开启或隐藏,其中 overlays 是 Game 中的公开成员: image.png ---- 本文介绍了,如何在 Flame 游戏中,让 Flutter 原生的组件发挥价值。

1.4K30

自定义一个弹窗视图

实现一个自定义弹窗视图 我们平时在开发的时候,经常会遇到这样的需求:在页面中弹出一个自定义视图,除了弹出的自定义视图之外,页面的其他位置都置灰态。比如下图这样: ?...要实现这样的效果,基本思路是: 1,新建一个弹窗背景视图,背景颜色设置为黑色,透明度设置为0.5; 2,将自定义弹窗视图加在弹窗背景视图上; 3,触发弹出弹窗视图的时候,将弹窗背景视图添加到程序的根窗口上...addSubview:_customView]; _customView.center = self.center; _customView.alpha = 0; } @end 上述代码是我封装的一个视图...展示上的自定义提示视图的时候,我使用了UIView的动画,可以在这里实现上的自定义提示视图展示时候的动画。 给的背景视图添加一个点击手势,以在点击的时候移除该

1.3K30

【CSS】CSS 背景设置 ② ( 背景位置 | 背景位置-方位值设置 )

文章目录 一、背景位置 1、语法说明 2、注意事项 二、背景位置-方位值设置 1、效果展示 2、完整代码示例 一、背景位置 ---- 1、语法说明 如果 盒子的大小 大于 背景图片的大小 , 默认的...: 第一个值默认是 x 坐标 , 第二个值为 y 坐标 ; 二、背景位置-方位值设置 ---- 1、效果展示 效果展示 : 设置背景位置为 右上角 : 粉色区域是盒子的区域 , 图片背景位于盒子右上角...; /* 设置背景位置 - 右上角 */ background-position: right top; 设置背景位置为 左下角 : 粉色区域是盒子的区域 , 图片背景位于盒子左下角 ; /* 设置背景位置..., 图片背景位于盒子中心位置 ; /* 设置背景位置 - 水平居中 垂直居中 */ background-position: center center; 设置背景位置 指定一个值 另一个默认居中...bottom;*/ /* 设置背景位置 - 水平居中 垂直居中 */ /*background-position: center center;*/ /* 设置背景位置 - 左下角

3.9K20

【CSS】CSS 背景设置 ③ ( 背景位置-长度值设置 | 背景位置-长度值方位值同时设置 )

文章目录 一、背景位置-长度值设置 二、背景位置-长度值方位值同时设置 三、完整代码示例 一、背景位置-长度值设置 ---- 长度值设置 效果展示 : 设置背景位置为具体值 10px 50px : 粉色区域是盒子的区域.../* 设置背景位置 - x 轴方向 10 像素 , y 轴方向 50 像素 */ background-position: 10px 50px; 设置背景位置为具体值 50px 10px : 粉色区域是盒子的区域.../* 设置背景位置 - x 轴方向 50 像素 , y 轴方向 10 像素 */ background-position: 50px 10px; 设置背景位置为具体值 50px : 粉色区域是盒子的区域...: 50px; 二、背景位置-长度值方位值同时设置 ---- 长度值方位值同时设置 效果展示 : 设置背景位置为具体值 center 50px : 粉色区域是盒子的区域 , 图片背景位于盒子位置 x...bottom;*/ /* 设置背景位置 - 水平居中 垂直居中 */ /*background-position: center center;*/ /* 设置背景位置 - 左下角

2.7K20

可编辑DIV设置光标位置

平时我们使用文本框input, textarea时,我们有时候需要得到光标的位置或者说设置光标的位置. 但是文本框有个不足,就是不能满足我们插入图片或者其他的一些要求....今天为了搞定设置DI的光标位置.头疼啊,终于可以了,记录一下,网上资料不多. 首先要让DIV启用编辑模式....下面说怎么获取或设置光标位置. 2个步骤 1:获取DIV中的光标位置 2:改变光标位置 var cursor = 0; // 光标位置 document.onselectionchange = function...用来记录光标位置....(); //因为这里死从当前光标开始移动的(好像文本框的是从0算起.)所以我们需要拿到当前光标位置,然后就可以计算出要移动多少位了,这样就可以把光标移动到想要的位置了 r.moveStart

6.4K40

百度分享插件的使用

bdMini int 1 | 2 | 3 下拉中分享按钮的列数 bdMiniList array [‘qzone’,’tsina’,…] 自定义下拉中的分享按钮类型和排列顺序。...bdPopupOffsetLeft int 正|负数 下拉的y偏移量 bdPopupOffsetTop int 正|负数 下拉的x偏移量 分享按钮设置 分享按钮设置的值为数组或对象,值为数组时可对多个分享按钮应用不同的设置...bdSize int 16|24|32 分享按钮的尺寸 bdCustomStyle string 样式文件地址 自定义样式,引入样式文件 窗分享设置 窗分享设置的值为数组或对象,值为数组时可在页面显示多个分享窗...bdPos string left|right 分享窗的位置 bdTop int 分享窗与可是区域顶部的距离(px) 图片分享设置 图片分享设置的值为数组或对象,值为数组时可对图片应用不同的设置...viewPos string top|bottom 图片分享展示位置。 viewColor string black|white 图片分享展示的背景颜色。

78410

百度分享插件的使用

bdMini int 1 | 2 | 3 下拉中分享按钮的列数 bdMiniList array [‘qzone’,’tsina’,…] 自定义下拉中的分享按钮类型和排列顺序。...bdPopupOffsetLeft int 正|负数 下拉的y偏移量 bdPopupOffsetTop int 正|负数 下拉的x偏移量 分享按钮设置 分享按钮设置的值为数组或对象,值为数组时可对多个分享按钮应用不同的设置...bdSize int 16|24|32 分享按钮的尺寸 bdCustomStyle string 样式文件地址 自定义样式,引入样式文件 窗分享设置 窗分享设置的值为数组或对象,值为数组时可在页面显示多个分享窗...bdPos string left|right 分享窗的位置 bdTop int 分享窗与可是区域顶部的距离(px) 图片分享设置 图片分享设置的值为数组或对象,值为数组时可对图片应用不同的设置...viewPos string top|bottom 图片分享展示位置。 viewColor string black|white 图片分享展示的背景颜色。

19520

js获取鼠标当前位置坐标

它指的是鼠标在页面上的位置,从页面左上角开始,即是以页面为参考点,不随滑动条移动而变化。...他值的是鼠标在页面上可视区域的位置,从浏览器可视区域左上角开始,即是以浏览器滑动条此刻的滑动到的位置为参考点,随滑动条移动 而变化。 相对于屏幕来说的screenX/screenY。...鼠标在屏幕上的位置,从屏幕左上角开始(w3c标准) 相较于触发事件的offsetX/offsetY。...这是一个IE特有的属性,鼠标相比较于触发事件的元素的位置,以元素盒子模型的内容区域的左上角为参考点,如果有boder,可能出现负值 相对于坐标系的layerX/layerY。...FF特有,鼠标相比较于当前坐标系的位置,即如果触发元素没有设置绝对定位或相对定位,以页面为参考点,如果有,将改变参考坐标系,从触发元素盒子模型的border区域的左上角为参考点也就是当触发元素设置了相对或者绝对定位后

14.5K20
领券