- 博客(131)
- 资源 (1)
- 问答 (1)
- 收藏
- 关注
RSS订阅
原创 总结常用的Android屏幕适配方案
本文主要介绍了目前常用的四种屏幕适配方案：dp适配、宽高限定符适配、今日头条density适配以及sw限定符适配，文中概括了各种适配的思路和实现，并贴上了深入学习的参考链接，希望能帮助大家更好地进行屏幕适配的工作
2018-10-25 10:48:24
762
原创 记2017上海谷歌开发者大会：第一天
前言今年受到朋友推荐申请了谷歌开发者大会的资格并完成了审核，在学校请了两天假去一睹谷歌开发者大会~不得不说谷歌真是大方，到场所有人人手一个Android things开发板和电脑包，还有各种数不清的限量版T恤以及玩偶，只要参与活动基本都能获得。下面我就把第一天（12月13日）的笔记同大家分享一下，毕竟我也是搞技术的，所以分会场的笔记可能和技术方面相关，如果有写错的或者不准确的也希望大家批评指正O(∩
2017-12-15 17:35:44
3325
3
原创 科大讯飞的语音合成（播放）功能
1.去官网注册账号科大讯飞要求使用SDK必须注册账号并设定你的应用绑定，这样才会生成一个你的AppID，用这个ID才能在你的应用中使用讯飞的SDK科大讯飞开放平台2.下载SDK注册好了以后，你必须添加你的应用，然后会出现你的专属的AppID，之后进入SDK下载界面，选择语音合成SDK包-Android-你的应用，然后就可以下载了。3.添加libs（注意Android s...
2017-11-30 09:26:56
4108
原创 Android BLE开发
这次实际项目中要求了手机终端和低功耗蓝牙即蓝牙4.0通讯的功能，所以这次我也就把我自己的Android代码同大家分享，稍后考虑将框架整理后上传Github供大家交流学习。1.蓝牙初始化 //初始化蓝牙设备 private void init_ble() { // 手机硬件支持蓝牙 if (!getPackageManager().hasSystemFeat
2017-09-07 09:40:47
569
原创 算法入门（六）：归并排序
这个排序正好可以用到之前博文的master公式，这是一个mergeSort，整体思路也是递归行为。先让left数组排好序，再让right数组排好序，最后整合为一个有序数组。关键的需要递归的整合算法：先准备两个指针和一个辅助数组，分别指向左侧数组0位和右侧数组0位，然后compare，哪边更小就先拷贝哪一侧然后偏移一位，如果存在越界了，把另一侧都拷贝下来：他的思想很重要，很多演化的题目，需要重点掌握这里主要关注递归思想，还有通过两侧的++完成运算后自主偏移，还有辅助数组使用（存在排序操作避免影响原先数组）接
2022-06-29 21:10:57
196
2
原创 算法入门（五）：对数器与递归复杂度计算
这是一种算法验证机制选择一种需要验证的方法A，和另一种可能速度有点慢但是已经验证好的方法B通过随机样本产生器从小到大产生随机样本，来进行实际测试例如排序我们就可以拿系统的排序算法当成方法B和自己编写的排序算法方法A通过对数器方式进行验证，具体代码可以参考下面图片：这里主要说一下什么是递归，以求数组最大值的算法来举例同时学习如何基于master公式来进行符合该公司的递归算法时间复杂度计算常规该问题可以通过遍历-比较-记录和更新最大值下标来通过O(N)时间解决。但是这里我们希望采用递归方式，采用递归就要搞清楚最
2022-06-27 10:01:16
208
原创 算法入门（四）：二分法的详解与扩展
原创不易~看完若对你有所帮助，记得点一个赞哈，这就是对我最大的支持了！这里主要通过三个问题来引出二分法的基本使用和扩展这个二分法最基本的使用，针对有序数组，以两等分方式递归找寻目标数字（通过比较二分值和目标值大小来选择下一次二分区间）这里时间复杂度是以2为底对数，例如8个数字找1个，最多对半3次 log2^8 = 3看到有序，可以想一想二分算法，这里也是可以通过二分来解决的。二分，判断二分值（这个位置通过index记录）和3关系，比3大或者等于3，去二分值左侧再二分，否则去右侧二分，同时通过一个变量记录3的
2022-06-26 11:11:49
304
原创 算法入门（三）：异或位运算的知识和拓展
原创不易~看完若对你有所帮助，记得点一个赞哈，这就是对我最大的支持了！异或的口诀可以记忆为：不进位相加，就是：0 ^ 1 = 1 // 0+1 = 11 ^ 0 = 10 ^ 0 = 01 ^ 1 = 0 // 1+1=10 -> 不进位是0注意异或满足的两个重要规律：交换律与结合律许多数一起异或，和乱序分开一部分一部分异或是完全一样的所以就有另外一种swap代码了，我们来看下：相关算法题问题1一个int数组，只有一种数出现了奇数次，其他数字都出现了偶数次，求该数字第一个问题有异或的知识基础话非常简单
2022-06-25 11:27:27
557
原创 算法入门（二）：简单排序算法
原创不易~看完若对你有所帮助，记得点一个赞哈，这就是对我最大的支持了！只需要额外几个变量完成:O(1)需要等规模的额外数组：O(N)原理之前在第一章节中已经说过了：核心就是遍历找最小值下标，和初始位置替换冒泡排序原理：通过遍历原数组，进行大小比较，保证一轮可以将最大值放到最右侧，然后下一轮可以将次大值放到length - 2地方，循环直到结束插入排序思想插入排序很重要的一点思想是保证局部有序看0-0范围是否有序，ok0-1范围是否有序，如果没有做到，交换arr[0]和arr[1]，知道有序，ok0
2022-06-23 10:35:43
77
原创 算法入门（一）：认识复杂度
原创不易~看完若对你有所帮助，记得点一个赞哈，这就是对我最大的支持了！一个操作如果和样本的数据量没有关系，每次都是固定时间，就是常数操作例如数组中取出i位置的数字就是常数操作，无论arr长度，寻址操作都是一个常数操作，计算一个偏移量就行了：其他例如位运算等都是常数操作但是链表里面的查找，以及很多框架的API都不是常熟操作：选择排序了解与引入时间复杂度这个排序思路很简单，先从0到N找最小值，然后记录最小值index和0位置交换，然后从1-N重复上述操作就可以0-N-1 首先我们需要看一下比较谁小 ， 需要看N
2022-06-19 11:53:04
126
原创 antd的Anchor锚点组件为什么没有随着页面滚动变化？
原创不易~看完若对你有所帮助，记得点一个赞哈，这就是对我最大的支持了！之前自己使用antd组件库的Anchor组件时遇到了一个问题，就是按照官方文档的用法配置组件之后发现我的Anchor锚点组件的锚点Title位置没办法随着我的页面滚动而变化。但是点击Title跳转具体锚定位置的功能却是没有问题的经过网上的一些资料搜索以及自己对API的实践，最终找到了问题所在，这里的Anchor组件有一个target属性，需要修改该属性来修改Anchor组件监听的滚动区域，默认情况下是监听body的滚动但是恰恰我们的业务场
2022-06-18 11:07:28
3948
原创 记一次包大小优化过程
起源主要来自我们通过微前端加载一个子应用时，结合devTool的network模块发现子应用的包有点太大了，chunk-vendor包有接近700多KB，在网速不好情况下可能需要大几s才能拉下来，所以尝试去优化该子应用的包大小优化之前首先要分析该应用的包构成，关注是哪些模块占据了较大空间，才能有针对性的着手优化。这里无论是react还是vue项目，都可以借助webpack-bundle-analyze工具来进行分析我这里是vue项目，直接基于vue-cli- service配置一下就可使用：接着打包的di
2022-06-17 10:53:57
753
原创 配置式路由中router路径大小写不一致导致的问题
近期开发的时候遇到一个奇妙的问题，就是某一次提交之后突然发现线上CI打包一直失败，之前其实遇到过类似的问题，当时分析之后判断是CI打包机器的环境问题，简单来说是打包机器的node版本和本地的node版本不一致，而且跨度有点大，导致CI失败，这次同样考虑到了之前遇到的问题，怀疑又是node版本本地和CI机器不一致导致的问题，排查了半天，删除了打包机的缓存，切换了版本还是报错。。。后面仔细查看了CI打包过程的Log日志，发现核心的提示是有部分components找不到导致的问题，思路切换到了项目工程的路由配置上
2022-06-16 10:47:12
772
原创 百度地图开发入门（6）：3D建筑
这里将会介绍基于百度地图与大数据来实现的立方体图形，这里就需要掌握面的概念：这里需要掌握shapeLayer：https://lbsyun.baidu.com/solutions/mapvdata，他可以提供一系列坐标点来形成一个面，最后多个面可以形成一个多边形。就是把圆球形地图变成一个直角坐标系，这样坐标系每一个点就可以对应到地球上的经纬度坐标，这种坐标就是墨卡托坐标。这里官方由这样的API来实现：https://lbsyun.baidu.com/index.php?title=webapi/guide
2022-06-15 09:53:45
1792
1
原创 百度地图开发入门（5）：飞线动画示例
讲解另一种常见应用-飞线动画，主要用于展示数据流向https://lbsyun.baidu.com/solutions/mapvdata这里曲线的绘制可以借助百度的曲线生成器：https://lbsyun.baidu.com/solutions/mapvdata这里其实mapv（mapvgl的前身）有很多很好的飞线图案例可以参考，不过官方已经不维护了，但是我们还是可以去学习一下，例如这里：http://mapv.baidu.com/examples/#baidu-map-forceEdgeBundli
2022-06-14 09:48:05
1401
原创 百度地图开发入门（4）：散点图示例
常规的包括散点图、飞线动画、3D建筑等等，这里只会介绍常用的部分，其他的可以去官方文档继续了解学习。也要学会如何快速复用官方的案例。官方文档：https://lbsyun.baidu.com/solutions/mapvdataMapVGL，是一款基于WebGL的地理信息可视化库，可以用来展示大量基于3D的地理信息点线面数据。设计初衷主要是为了解决大数据量的三维地理数据展示问题及一些炫酷的三维效果。下面会学习一系列案例，可抽象出一个统一的开发模式官方有一个common库可以引入，简化我们部分map的操作：
2022-06-12 11:36:44
861
原创 百度地图开发入门（3）：动画
百度地图提供了一些API来提供动画的开发简单来说是通过定义多个关键帧来完成动画，过渡有百度地图完成可以用于地图某个区域的旋转展示等等功能。接着我们看看这个事件有哪些：这里如果你想要通过自定义的按钮来控制动画开始，需要注意map是有z-index的，需要保证你的button区域的z-index > 9才行。然后在button的click事件调用map.startViewAnimation方法来开启动画主要用于标注A点到B点的过程，展示路径和过程。这个官方文档还没更新，直接演示吧：如果要做细需要花时间精确
2022-06-11 10:42:06
1193
原创 百度地图开发入门（2）：控件与个性化地图
这个控件的概念类似echarts中的组件，例如地图里面控制放大缩小的图表、标尺等等工具。首先我们添加一个控制zoom的组件：注意百度文档不一定百分百可信，出现问题还是要打印对象看这个控件用于描述地图上一段距离代表的实际长度，他会根据你的实际缩放比例调整文案：即可以自定义百度地图的部分样式，例如地图上面区域换一个颜色，路径换一个颜色等等。这里我们可以前往百度的个性化地图中编辑，通过一些样式模板以及二次操作来生成最后的地图样式：https://lbsyun.baidu.com/index.php?title
2022-06-09 12:25:20
708
原创 百度地图开发入门（1）：案例
将我之前的百度地图入门的一些博文分享一下，这里主要系统讲解地图可视化的开发方式具体可以参考这里：https://lbsyun.baidu.com/index.php?title=jspopularGL/guide/getkey最后当你的应用创建好了，就会得到一个服务密钥然后这里是百度地图的API：https://mapopen-pub-jsapi.bj.bcebos.com/jsapi/reference/jsapi_webgl_1_0.html第一步是需要显示出地图，这里我们使用html原生方式来讲解以
2022-06-08 14:42:03
2638
原创 docker部署springboot项目
之前搭建的springboot项目本地测试OK，下一阶段就是部署到服务器上并运行了，这里我准备基于docker以容器化的方式来尝试部署前提条件你的机器已经安装了docker，并且已经pull了openjdk镜像，如果没有可以通过如下命令来获取：docker pull openjdk:8构建Dockerfile文件首先我们需要Dockerfile文件来描述来构建docker镜像，在其中编写构建一层一层layer的命令，我的Dockerfile文件：FROM openjdk:8COPY targ
2021-11-29 20:52:07
317
原创 Flutter的依赖报错-Could not resolve all files for configuration xxxx
今天遇到一个很坑的问题，排查了许久，网上也找了资料都没解决，最后还是耐下心来分析Log和网上的解决思路才知道问题所在，最终只修改了一丢丢代码和配置即解决了上述问题问题描述运行一个之前OK的Flutter项目时报错，Log类似如下：* What went wrong:Execution failed for task ':firebase_core:javaPreCompileDebug'.> Could not resolve all files for configuration 'xxx
2021-11-28 12:46:27
2269
原创 Flutter网络请求
这里主要分享我对于Flutter网络请求方面的内容目的目的很简单，需要完成项目中常规的Http的GET和POST请求服务端接口数据以完成页面部分展示逻辑方案主要实现方案有三种，一种是基于原生的HttpClient来实现，另外两种是基于第三方package来实现：http与diohttpClient原生方式主要基于dart:io库中的httpClient来实现：import 'dart:io';var httpClient = new HttpClient();该 client 支持常用
2021-11-28 12:40:44
1995
原创 HTML基础知识
认识HTML-这门Web语言HTML：超文本标记语言的缩写宏观角度通过HTML编写的文件来建立Web页面然后可以把文件放到服务器上，任何浏览器就可以访问到你的HTML网页Web服务器作用就是一个连接到互联网的计算机，等待来自浏览器请求存储HTML文件，图像，声音等文件浏览器认识知道如何显示HTML，另外甚至可以在手机和其他设备中显示HTML告诉浏览器页面的内容和结构浏览器根据内置的默认规则翻译HTML的标记你哈可以通过CSS来增加自己的样式创建HTML文件HTML文件都是文
2021-11-22 11:23:37
459
原创 Dart私有仓库-私服搭建
文章目录1. 为什么需要私服2. 服务端方案3. 客户端方案4. 绕过谷歌登录5. 回顾之前因为业务需要，需要在公司内部搭建dart私有仓库（私服），主要存放和管理公司内部flutter开发所需要的组件，这里把核心的流程和技术梳理一下分享给大家~如果有帮助别忘了点个赞哈1. 为什么需要私服有同学可能会问，dart官方不是有提供组件仓库吗？为啥还需要自己的私服呢，感觉吃力不讨好其实dart私服存在的目的和gitlab私服等都是一样的，有一定规模的公司都会存在一些内部库/组件，可能会包含一定的业务成分不
2021-11-14 17:57:15
2273
原创 React开发chrome插件系列教程之插件开发环境搭建
文章目录预期目标开发环境搭建实践create-react-app搭建标准react工程工程开发目录配置修改webpack生成上述build目录设置多入口固定build生成的文件名设置popup不引入另外两个模块的js引入Antd回顾总结紧接上一篇文章对chrome插件的基本介绍，这里我们就来开始真正实践一下插件的开发吧，第一部分就从开发环境搭建入手吧，这一部分也是插件开发和Web-SPA应用开发区别较大的一部分预期目标预期目标是搭建React+TS+Antd的插件开发环境，支持build生成插件所需要
2021-11-07 19:27:56
1468
原创 React开发chrome插件系列教程之chrome插件基本介绍
文章目录chrome插件能干什么chrome插件的版本chrome插件的浏览器支持chrome插件的功能组成manifest.jsonpopupcontent scriptbackground scriptchrome插件的展现形式browserAction(浏览器右上角)pageAction(浏览器右上角)右键菜单override(覆盖特定页面)devtools(开发者工具)回顾总结这里包括下文讨论到的chrome插件其实是官方所指的chrome extension，考虑到目前主流的叫法皆以chrome
2021-10-24 21:44:25
4771
2
原创 Web和Flutter盒模型不一致导致的尺寸渲染差异问题
问题定位在测试flutter动态化引擎过程中发现相同width的CSS样式下发到flutter到时渲染和web端不一致，明显感觉端上的宽高要多出一部分，但是宽度和margin的值完全一样。花了一些时间排查这个问题，基本定位到问题来源于两者使用的盒模型不一致所导致的。盒模型盒模型最直观的就是下面这张图片：标准的W3C盒模型由4部分组成：content，padding，border和margin。对应box-sizing的value为content-box简单来说元素的宽度=content wid
2021-10-17 18:32:23
907
原创 模板引擎的整理归纳
文章目录1. 模板引擎是什么2. 不使用模板引擎的示例字符串拼接构造DOM对象3. 使用模板引擎的方式置换型模板引擎JS代码函数型模板语法dom-based模板引擎4. 前端与后端的模板引擎渲染发展变化发展阶段后端模板引擎渲染客户端渲染node中间层服务器端渲染（SSR）使用建议5. 开源的模板引擎6. 参考博客最近项目中涉及到模板引擎，参考了一些博客文章进行了一些学习，并在此进行记录1. 模板引擎是什么首先我们来了解什么是模板，模板就我个人理解而言其产生的目的是为了解决展示与数据的耦合，简单来说模板
2020-11-08 12:38:46
342
原创 提高webpack打包速度
文章目录跟上技术的迭代在尽可能少的模块上应用loaderPlugin尽可能精简并可靠resolve参数的合理配置使用DllPlugin提高打包速度去除冗余引用多进程打包合理使用SourceMap结合stats.json文件分析打包结果开发环境无用插件需要剔除主要讲解一些常见的提高webpack打包速度的方法供大家参考探讨~跟上技术的迭代随时升级webpack及其相关管理工具的版本，包括npm，node，yarn等。每个版本都会有优化，同时webpack建立在node环境之上，node的升级也会有一定
2020-10-17 11:57:01
712
原创 Webpack的配置案例-devServer、EsLint与多页面
文章目录1. devServer实现请求转发问题发现devServer的proxy更多配置注意事项解决单页面应用路由问题问题引入使用devServer解决2. EsLint的配置简单介绍webpack中使用最佳实践3. 多页面打包配置案例实验环境搭建生成多个HTML文件自动化生成多HTMLPlugin1. devServer这里讲解两个devServer相关的配置案例实现请求转发问题发现这里我们基于React尝试发送一个Ajax请求，这里先借助axios库来实现：axios.get('http:
2020-10-17 11:56:29
406
原创 Webpack的配置案例-库、PWA、TS打包配置
文章目录1. library的打包编写基础代码webpack的安装和配置别人如何引入你的库文件externals参数库文件上传2. PWA打包模拟服务器引入PWAPWA插件应用service-worker实现PWA3. Typescript(TS)打包编写demo工程webpack配置tsconfig.json配置文件ts中引入库文件时注意事项1. library的打包前面讲解的都是对自己的业务代码来打包，这里阐述一下如何利用webpack来打包自己的库代码，这里我们以一个简单的函数库为例编写基础代码
2020-10-17 11:56:01
268
原创 Webpack的进阶概念-CSS分割、Shimming与其他
文章目录1. CSS的分割1.1 MinicssExtractPlugin介绍和使用1.2 filename和chunkFilename1.3 生产环境优化压缩（production） - 合并压缩2. Shimming2.1 ProvidePlugin插件2.2 imports-loader3. content-hash4. 环境变量1. CSS的分割之前的文章中讨论主要围绕JS的代码分割和应用，这里我们来看一下针对CSS的分割1.1 MinicssExtractPlugin介绍和使用这个插件帮助
2020-10-06 17:47:38
257
1
原创 Webpack的进阶概念-CodeSplitting、懒加载与预加载
文章目录1. CodeSplitting1.1 问题引入1.2 引入codeSplitting解决1.3 webpack中的CodeSplitting1.4 异步模块引入和拆分1.5 SplitChunksPlugin配置参数详解重命名针对异步/同步代码分割代码分割的阈值二次分割打包数量要求命名连接符cacheGroups1.6 Chunk是什么2. 懒加载LazyLoading3. 打包分析工具4. 预加载4.1 问题引入4.2 Preloading与Prefetching解决问题1. CodeSpli
2020-10-06 17:47:06
462
原创 Webpack的进阶概念-TreeShaking与buildMode
文章目录1. TreeShaking1.1 问题引入1.2 配置使用2. buildMode2.1 为不同模式分别编写配置文件2.2 配置封装2.3 小提示1. TreeShakingtree shaking 是一个术语,通常用于描述移除 JavaScript 上下文中的未引用代码(dead-code)。它依赖于 ES2015 模块系统中的静态结构特性,例如 import 和export1.1 问题引入我们新增一个工具文件math.js，里面编写一个add和minus方法：//math.jse
2020-10-06 17:46:34
376
原创 Webpack的核心概念-devServer、HMR与Babel
文章目录1. devServer1.1 使用--watch参数1.2 webpackDevServer基础使用其他配置1.3 自己实现一个类似的服务搭建环境编写server.js2. Hot Module Replacement - 热模块更新2.1 HMR使用CSSJS2.2 注意事项3. Babel3.1 问题引入3.2 Babel的介绍和使用3.3 babel/polyfill使用3.4 babel/plugin-transform-runtime3.5 解决options配置项过多问题3.6 配置R
2020-10-03 21:34:41
410
原创 Webpack的核心概念-entry、output与sourceMap
文章目录1.entry与ouput的基本配置1.1 打包多个文件并输出1.2 为HTML的JS引用添加公共域名2. sourceMap的配置2.1 什么是sourceMap2.2 sourceMap的使用2.3 其他类型SourceMap配置介绍inline-source-mapcheap-inline-source-mapcheap-module-source-mapeval前缀2.4 最佳实践2.5 映射原理1.entry与ouput的基本配置这里我们继续讲解一下这两个配置项：...entry:
2020-10-03 21:34:09
292
原创 Webpack的核心概念-loader与plugin
文章目录1. Webpack的loader1.1 问题引入1.2 loader是什么1.3 配置文件修改以引入loader1.4 loader打包静态资源-图片保持图片原名打包其他类型图片希望图片资源打包后存放在一个单独目录url-loader与file-loader区别最佳实践1.5 loader打包静态资源-样式使用style-loader与css-loader样式中前缀的补足scss的处理less的处理1.6 css-loader的进阶配置importLoadersCSS模块化1.7 loader打包
2020-10-03 21:33:16
168
原创 Webpack的入门介绍
文章目录1.问题引入2.安装Webpack2.1 安装node2.2 初始化环境3. Webpack的使用4. Webpack是什么？5. Webpack的配置文件5.1 新增一个配置文件5.2 npm scripts配置6. 打包时的log说明1.问题引入原始的时候我们编写网页程序，主要是编写HTML文件，接着通过scrpit标签引入一个index.js文件辅助编写一些业务逻辑和DOM操作。若JS处理逻辑过多，index.js文件就会膨胀，而且编写逻辑主要以面向过程为主，不好维护和扩展。接着可以考虑
2020-10-03 14:39:05
70
原创 CSS Flexbox弹性盒子模型总结
1. 背景弹性盒子布局指在提供一个为容器内的items进行更有效率的排列，分配空间以及布局的方式，弹性的意思是即便items的尺寸是未知或者动态的也可以使用！这种布局的理念主要是给容器一种能力可以调节修改items的宽度高度和顺序来充分利用容器内可用的空间—甚至可以适应几乎所有的设备和屏幕尺寸。更重要的是，弹性盒子布局的方向是不可知的，这个与常规的布局相反（块布局是垂直方向的而行内则是水平基...
2020-03-05 14:53:12
208
原创 React项目部署在阿里云服务器ECS
本来计划是将一个React工程部署在自己的Centos虚拟机中，但是因为一些网络和安全问题暂时停止了这个计划，于是就把该项目转移到阿里云服务器中，这篇笔记记载了如何从第一步开始直到浏览器通过IP可以访问你的React项目为止。1.编译你的React项目我的项目是通过create-react-app脚手架创建的，当项目编写完成之后可以执行package.json下面的build脚本就可以了：n...
2020-02-16 20:02:46
907
有没有什么开源的Web端设计移动端原型的工具
2019-10-22
TA创建的收藏夹 TA关注的收藏夹
TA关注的人