首页
学习
活动
专区
圈层
工具
发布

iOS 9人机界面指南(四):UI元素(上) - 腾讯ISUX

状态栏: 是透明的 始终固定在整个屏幕的上边缘 API注释 你可以将全应用的状态栏风格设计成统一的,或者给不同的视图控制器定义不同的状态栏风格。...千万千万,避免在状态栏后面叠加会分散注意力的内容。尤其是,你不能让用户觉得轻击状态栏之后可以获取内容或激活你的应用中的控件。 隐藏状态栏时请慎重。由于状态栏是透明的,通常情况下不需要隐藏它。...导航栏: 是半透明的 通常位于屏幕的上方,状态栏正下方。...确保你自定义的导航栏在你的应用的每个视图中都拥有一致的外观与体验。举个例子,不要在同一个应用中使用不透明导航栏和半透明工具栏。...用户习惯了在系统内置地图中进行交互,因此他们会有预期,能在你所提供的地图中进行类似的行为。 使用标准的地图标注颜色。地图上标注了一系列地点。

15.9K51

从0到1全流程落地web游戏大地图项目,成为WebGlS专家

:支持 “无限滚动” 的大地图,避免一次性加载全部地形导致的内存溢出;​技术方案:实现 “瓦片式加载”(Tile-Based Loading),结合 “视口裁剪”(Frustum Culling)只渲染当前视角可见的地形瓦片...模块 2:大规模实体渲染与交互​核心需求:地图中同时显示数千个 NPC、怪物、玩家角色,支持 “点击选中”“碰撞阻挡” 等交互;​技术方案:采用 “实例化渲染(Instanced Rendering)”...模块 6:地图功能扩展与逻辑集成​核心需求:将大地图与游戏核心玩法结合,如 “任务导航”“地图探索进度”“区域解锁”;​技术方案:实现 “路径寻路”(A * 算法在网格地图中的应用),支持角色自动导航到目标点...Lighthouse 测试页面加载速度,定位 “资源加载阻塞”“长任务导致的卡顿” 问题;​核心优化策略实战:​渲染性能优化:减少 Draw Call(合并静态模型、使用实例化渲染)、降低 Overdraw(避免透明物体叠加过多...学习收获​硬技能:精通 WebGL 底层原理与 Three.js 等框架实战,能独立落地商业级 Web 游戏大地图项目,掌握 “性能优化、多端适配、工程化部署” 核心能力;​项目经验:获得可写入简历的

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

    移动端常用的meta总结

    声明viewport视口 viewport对于移动端设备来说非常的重要,用于定义视口的各种行为。...,单位为像素 height 正整数或device-height 定义视口的高度,单位为像素 initial-scale [0.0-10.0] 定义初始缩放值 minimum-scale...content的值为 default(状态栏将为正常的,即白色,网页从状态栏以下开始显示) | black(状态栏将为黑色,网页从状态栏以下开始显示) | black-translucent(状态栏将为灰色半透明...,网页将充满整个屏幕,状态栏会盖在网页之上)。...name="nightmode" content="enable|disable"/> //->夜间模式 强制图片显示:UC浏览器为了节省流量,为用户提供了无图模式,但是如果页面的图片是必不可少的,如验证码的

    1.5K30

    优质开源GIS项目-Mars3D三维可视化平台

    Mars3D三维可视化平台,是一款支持多行业应用的网页端二三维 GIS 可视化地图平台。...通过 Mars3D产品可快速实现浏览器和移动端上美观、流畅的三维地图呈现与空间分析。...提供了状态栏、导航球、比例尺、分屏比对、卷帘比对等多种场景工具;提供空中、室内、行人步行、车辆贴地等多种飞行漫游路线功能;5)空间分析能力:提供了包括距离、面积、高度、角度、剖面、体积等多种量算分析功能...;提供通视、可视域、缓冲、日照、坡度坡向、淹没分析功能;提供了等高线、天际线、地表透明、地形开挖、模型剖切、模型裁剪、模型开挖等功能。...高度6)高度兼容第三方:提供对ArcGIS、OGC、SuperMap、各类在线地图、百度高德服务等各类第3方地图与服务的全面支持。

    1.9K10

    一文详解ORB-SLAM3中的地图管理

    1.基本概念 ·共视图 Covisibility Graph: 共视图是一个加权无向图,图中每个节点是相机的位姿,如果两个位姿的关键帧拍摄到的相同关键点的数量达到一定值(论文设定为至少15个),则认为两个关键帧具有共视关系...Essential Graph中的节点依旧是全部的关键帧对应的位姿,连接的边包含三种边:Spanning Tree的边、共视图中共视关系强(共视点数量超过100)的边、以及回环时形成的边。...1) 选择候选帧 当每次获得一个关键帧时,都会判断是否与之前的关键帧发生了回环。...位姿计算:通过Horn+RANSAC方法初步计算两个关键帧之间的变换关系,之后将待吞并地图的地图点通过这个变换投射到当前关键帧Ka上,再利用引导匹配的方法获得更丰富的匹配并进行非线性优化,获得精确的变换...衔接区域的局部BA优化:融合后与Ka具有共视关系的关键帧参与局部BA优化,为避免gauge freedom,固定之前活跃地图中的关键帧而移动其他的关键帧。

    2.1K10

    腾讯地图车道级导航上线全国360+城市,开启导航新纪元

    如何在各种黑科技的加持下 轻松拿捏每一个分岔路口 让你看得真、开得酷!...,实现车道级定位 车道级自适应引导技术 结合了海量导航轨迹、 精准的路网数据以及 小图自主研发的车道级引导算法 为图粉们带来全方位的驾驶助手 无论是在高速公路的连续出口 城市的复杂交叉路口 图粉们都能获得高效和准确的引导...智能提示及时纠偏免扣分; 改变路线、偏航时 迅速识别并重新规划路线…… 即使是在高铁站、飞机场 新手司机也不再迷路 看得更真 智能动态调整导航视野 能在连续多路口或视线受限的路段 开启“上帝视角” 如大型交叉口或连续弯道...让大家在到达路口前就做足变道准备 自研的“干扰道路动态半透算法” 能实时计算导航路线上层道路的透明效果 让大家在经过交叉、重叠路段时 也能从导航里看清上下层道路 先进的渲染实例化技术 结合智能运镜、..., 在导航地图中开启 游戏同款名车伴你上路的酷炫体验 如今,腾讯地图每天为用户 规划了7亿km的车道级里程 无论是最北边的大兴安岭漠河 最南端的三沙市 最西端的新疆帕米尔高原 最东端的黑龙江和乌苏里江交界

    1.3K10

    最新iOS设计规范三|3大界面要素:栏(Bars)

    有时,导航栏的右侧也会有一个控件,如“编辑”或“完成”按钮,用于管理活动视图中的内容。在拆分视图中,导航栏可能会显示在拆分视图的单个窗格中。...隐藏状态栏下的内容。默认情况下,状态栏的背景是透明的,是可以看到背后的内容的。保持状态栏可读,并不意味着其背后的内容是可交互的。...有几种常见的技术可以做到这一点: · 在APP中使用导航栏,该导航栏会自动显示状态栏背景,并确保内容不会显示在状态栏背后 · 在状态栏背后显示自定义图像,如渐变色或纯色 · 在状态栏背后放置模糊的视图...在“照片”应用中浏览全屏照片时,只需轻按一次即可再次显示状态栏。 五、标签栏(Tab Bars) 标签栏出现在页面底部,可以在APP的不同模块之间快速切换。标签栏是半透明的,也可添加背景颜色。...如果需要提供对当前视图中的元素起作用的控件,请改用工具栏。 争取获得正确数量的标签。标签太多会减少每个标签的可点击区域,并增加应用程序的复杂性,这会使人们更难找到信息。

    14.9K10

    一文详解ORB-SLAM3中的地图管理

    1.基本概念 ·共视图 Covisibility Graph: 共视图是一个加权无向图,图中每个节点是相机的位姿,如果两个位姿的关键帧拍摄到的相同关键点的数量达到一定值(论文设定为至少15个),则认为两个关键帧具有共视关系...Essential Graph中的节点依旧是全部的关键帧对应的位姿,连接的边包含三种边:Spanning Tree的边、共视图中共视关系强(共视点数量超过100)的边、以及回环时形成的边。...1) 选择候选帧 当每次获得一个关键帧时,都会判断是否与之前的关键帧发生了回环。...位姿计算:通过Horn+RANSAC方法初步计算两个关键帧之间的变换关系,之后将待吞并地图的地图点通过这个变换投射到当前关键帧Ka上,再利用引导匹配的方法获得更丰富的匹配并进行非线性优化,获得精确的变换...衔接区域的局部BA优化:融合后与Ka具有共视关系的关键帧参与局部BA优化,为避免gauge freedom,固定之前活跃地图中的关键帧而移动其他的关键帧。

    1.5K30

    Android 天气APP(二十四)地图天气(上)自动定位和地图点击定位

    public void initData(Bundle savedInstanceState) { StatusBarUtil.transparencyBar(context);//透明状态栏...,在页面初始化initData()的时候修改状态栏的背景和字体颜色。....target(latLng)//设置地图中心点,传入经纬度对象 .zoom(13.0f);//设置地图缩放级别 13...然后赋值给一个全局的经纬度变量,再把这个变量放到定位数据里,再设置成地图中心坐标,最后渲染出来,就可以做到,我点那里就定位到哪里了,指哪打哪。OK,没有效果图那就是扯淡,运行一下: ?...最后就是在定位监听返回时获得坐标时,进行反编译 ? 运行一下: ? OK,现在已经拿到相应的省市县数据了,那么就可以进行天气的数据渲染和请求了。

    2.7K20

    一文详解ORB-SLAM3

    中期的数据关联:匹配相机累计误差小的地图,这也可以用在BA中,当系统在已经建好的地图中运行的时候可以达到零漂移。...在本文的工作中我们提出了基于三个关键insights的快速精准的初始化方法: 纯单目SLAM可以提供非常精确的初始地图,但是不知道尺度。所以可以加入Imu获得尺度信息。...初始化后我们有按一定尺度比的由十个相机位姿和数百个3D点组成的地图。利用图2中纯视觉的模型进行BA优化。这些位姿被转换到机体坐标系下获得轨迹 ? 。 纯惯导的MAP估计:惯导的状态向量为: ?...为了改进初始估计,在初始化后5秒和15秒进行视惯性BA,收敛到1%尺度误差,如第七节所示。...这个方法的关键是:在大多数情况下我们需要验证的信息已经都在地图中了,为了验证位置重识别,我们在active地图中和Ka共视的两个关键帧(共视帧中共视的地图点超过一定的阈值。

    3.3K01

    一文详解ORB-SLAM3

    中期的数据关联:匹配相机累计误差小的地图,这也可以用在BA中,当系统在已经建好的地图中运行的时候可以达到零漂移。...在本文的工作中我们提出了基于三个关键insights的快速精准的初始化方法: 纯单目SLAM可以提供非常精确的初始地图,但是不知道尺度。所以可以加入Imu获得尺度信息。...初始化后我们有按一定尺度比的由十个相机位姿和数百个3D点组成的地图。利用图2中纯视觉的模型进行BA优化。这些位姿被转换到机体坐标系下获得轨迹 。...为了改进初始估计,在初始化后5秒和15秒进行视惯性BA,收敛到1%尺度误差,如第七节所示。...这个方法的关键是:在大多数情况下我们需要验证的信息已经都在地图中了,为了验证位置重识别,我们在active地图中和Ka共视的两个关键帧(共视帧中共视的地图点超过一定的阈值。

    2.7K20

    多会话、面向定位的轻量级激光雷达(LiDAR)建图方法

    语义特征提取:根据城市环境的先验知识,选择了几种特定类型的语义地标,如电线杆、道路、建筑物和围栏,作为地图元素。这些元素通常存在于城市环境中,并具有紧凑的几何表示。...轻量级地图结构:在线地图生成过程中,初始化和更新线和平面地标,其中数据关联基于基于质心的最近邻搜索方法构建了共视结构。...在线地图制作和集中式地图服务器分别显示为绿色和橙色的块。子地图包括轻量级地标,包括线和平面,以及关键帧和地标之间的共视连接。...多会话LiDAR地图制作的地标定义和因素:使用LOAM获取的里程计因素(绿色),使用GraffMatch获取的环路因素(蓝色),以及通过提出的捆绑调整获得的激光因素(红色)。...为了减小地图的大小和后续优化的维度,这些地标在多个子图中的实例将根据图匹配结果或质心距离而合并。

    1K30

    Mars3D三维可视化平台

    通过 Mars3D产品可快速实现浏览器和移动端上美观、流畅的三维地图呈现与空间分析。...场景工具 提供了Popup鼠标单击弹窗、Tooltip鼠标移入弹窗、右键菜单的内置工具,可以方便的对地图、图层、数据进行绑定和交互。...提供了状态栏、导航球、比例尺、分屏比对、卷帘比对等多种场景工具;提供空中、室内、行人步行、车辆贴地等多种飞行漫游路线功能; 5.空间分析能力 提供了包括距离、面积、高度、角度、剖面、体积等多种量算分析功能...;提供通视、可视域、缓冲、日照、坡度坡向、淹没分析功能;提供了等高线、天际线、地表透明、地形开挖、模型剖切、模型裁剪、模型开挖等功能。...高度兼容第三方 提供对ArcGIS、OGC、SuperMap、各类在线地图、百度高德服务等各类第3方地图与服务的全面支持。

    2.2K20

    Android 沉浸式解析和轮子使用

    在上图中: 非沉浸模式 —— 展示了应用进入沉浸模式之前的状态。也展示了设置 IMMERSIVE 标签后用户滑动展示系统栏的状态。...1.1.2 两种使用这个属性的方式: 在使用时候,我们通常需要考虑的是状态栏一值显示在顶部而不会隐藏或者被遮挡(其他 app 情况如:读书 app 或者是游戏 app 则需要隐藏顶部状态栏),所以只需要通过代码设置...style> 二、ZanImmersionBar 轮子的原理和使用 在实际开发过程中,我们不仅仅只会遇到以上三种版本兼容问题,还需要考虑如:不同手机品牌,动态该状态栏背景,以及 Fragment 中需要有自己的状态栏颜色场景...() //透明导航栏,不写默认黑色(设置此方法,fullScreen()方法自动为true) .transparentBar() //透明状态栏和导航栏...(R.color.colorPrimary) //同时自定义状态栏和导航栏颜色,不写默认状态栏为透明色,导航栏为黑色 .statusBarAlpha(0.3f) //状态栏透明度

    4.1K10

    透明到无障碍:CSS媒体查询在供应链系统的实战应用

    本文将深入解析其技术原理,并展示如何在新零售供应链系统中落地实践。...:半透明数据浮层可能遮挡关键库存信息物流追踪:地图上的半透明路线标记影响路线识别效率采购看板:透明度的减少可提升低光照环境下的操作效率二、供应链系统实战应用2.1库存卡片组件改造/*src/components...2.2物流地图路径优化//src/utils/mapUtils.jsexportconstapplyMapStyle=()=>{constisReduceTransparency=window.matchMedia...none':'5,3'}};};设计思路:JS动态检测媒体查询状态降级时使用更粗的实线替代半透明虚线提高路径与地图底色的对比度参数解析:strokeWidth增加25%补偿视觉权重dashArray从虚线改为实线提升识别度颜色从...在供应链这类重数据、重操作场景中,它帮助我们在保持界面美观的同时,确保视障用户、老年用户、低配设备用户都能高效完成任务。当技术选择从"看起来很美"转向"用起来很顺",才是真正以用户为中心的设计进化。

    11820

    论文翻译 | ORB-SLAM3:一个用于视觉、视觉惯性和多地图SLAM系统

    是第一个可以重用历史所有算法得到的信息的系统,也就以为着之前的共视关键帧也可以用来一起BA(无论是地图集里活动地图还是非活动地图的共视关键帧). 3 介绍 在过去的二十年里,通过单独使用摄像机或与惯性传感器相结合....我们提出了一种新的位置识别算法,首先检查候选关键帧的几何一致性,然后检查与三个可共视关键帧的局部一致性,这三个关键帧在大多数情况下已经在地图中.这种策略提高了查全率,增加了数据关联度,提高了地图精度,...,在活动地图中的关键帧和地图集中的不同地图中的匹配关键帧之间,使用对齐变换进行地图合并操作.需要确保Mm中的信息能被tracking线程及时调用,避免地图重复.因此作者建议将引入坐标系,并且中信息较多,...、及其共视关键帧以及它们观察到的所有地图点。...首秀是地图点融合:融合窗口由匹配的关键帧组合而成,检测到重复的点进行融合,在共视性和本质图中创建新的关联.

    6K40

    旷视SLAM组负责人刘骁:三维视觉与机器人

    从概率角度看,假设给定一系列传感器,则有两个待估计量需要计算:姿态与路标(一般指空间中的几何特征如点、线、面等),从而整个SLAM问题可以归结为一个后验概率最大的问题。 ?...为了获得高鲁棒性的定位效果,当前多采用基于深度学习的提取描述子的方法。 一般的定位流程如下:离线时,用前文的SLAM地图构建方法建立一个稀疏的点云地图,同时对关键帧提取全局和局部特征,构建数据库。...下图展示的是高精度到点的算法效果,图中搭载该套算法的是旷视S500机器人,它正在进行滚轮对接的demo演示。...下图展示了一个完全基于图像检测的语义SLAM系统,它能够通过检测地图中的物体来对其进行识别与定位。...下图展示了在已经建好的稀疏三维地图中,仅使用分割信息作为观测,不使用任何描述子,而是通过特征点的位置和类别的方式进行定位的过程。

    2.4K40

    unity3d新手入门必备教程

    再打开Max文件,导出为FBX文件,使用默认设置,FBX文件也放置在和Max文件相同的目录下,如    导出的时候,可以将模型简单的分类,如地面、植被、楼房等,也可以将模型分为几个区域,如小区1,小区...播放按钮和状态栏这个按钮用来在游戏视图中播放,暂停和步进你的游戏。在你构建场景的任何时候,你都可以进入播放模式 (Play Mode)并看看你的游戏是如何工作的。    ...右侧的状态栏有多种不同的作用。它将提供上下文敏感信息和提示,错误信息和来自与脚本的输出语句。如果你的游戏有任何问题,查看状态栏将是昀好的发现问题的方法。...当武器被绘制时,不透明部分将完全覆盖所有已显示部分,而不论武器与墙有多么接近。    ...你可以将地图放置在屏幕的右下角,或者将×××提示视放置在屏幕的左上角。只要一点设置工作,你就可以使用视口矩形 (Viewport Rectangle)来创建特有的行为。

    9.2K10
    领券