Canvas 无法直接获得键盘焦点,但可以通过设置 tabindex 属性的方式获得焦点,实现代码如下: canvas.setAttribute('tabindex', '0'); // needed to put focus on the canvas canvas.addEventListener('click', function() { canvas.focus(); }); canvas.focus();

其实这个功能是仿苹果的,但是现在大多数Android设备都已经有了这个功能,尤其是在通讯录中最为常见.先来看看今天这个DEMO的效果图(如下图):从图中我们可以看到,屏幕中的主体是一个ListView,右边有一个导航栏,里面放着字母/数字的索引(如图1),用手指点击/移动手指可以改变选中的索引,同时ListView将滚动到选中的索引对应的第一条数据(如图2):如果ListView的数据中没有选中的索引对应的数据,则将ListView滚动到选中索引上面离选中索引最近的有数据的索引对应的第一条数据(

  感谢eoe社区的分享   最近看关于Android实现ListView的功能问题,一直都是小伙伴们关心探讨的Android开发问题之一,今天看到有关ListView实现A-Z字母排序和过滤搜索功能并且实现汉字转成拼音的功能,转帖来和eoe的小伙伴们一同分享下! Android 有关ListView实现A-Z字母排序和过滤搜索功能并且实现汉字转成拼音的功能 我们知道一般我们对联系人,城市列表等实现A-Z的排序,因为联系人和城市列表我们可以直接从数据库中获取他的汉字拼音,而对于一般的数据,我们怎

现在很多APP只要涉及到联系人的界面,几乎都会采取字母排序以及导航的方式.作为程序猿,这种已经普及的需求还是需要学习的,于是小生开始了在网上默默的学习之路,网上学习的资料质量参差不齐,不过也有很不错的文章,文章后面分享给大家.这篇文章,仅是小生在学习之后,自己独立编写与总结吧.废话不多说先上效果图. 从界面上看,整个实现效果有两个重点: 实现字母分类. 实现右侧的字母导航. 我们先一个一个来了解解决方案,再上代码. 实现字母分类: 字母分类又分为三个小要点:一个是将中文转化为拼音,一个是实现按照

转载:http://blog.csdn.net/xiaanming/article/details/12684155 转载请注明出处:http://blog.csdn.net/xiaanming/article/details/12684155 前段时间因为换工作的缘故又恰巧碰到国庆节,所以有段时间自己没有更新博客了,过完国庆到新公司报道,感觉还不错,就是现在住的地方离新公司有点远,地铁20站,伤不起啊,我每天早上7点多就要起床,然后屁颠屁颠的去挤地铁上班,晚上下班还要挤地铁,先不说路程远,车费

先看下效果 一 .布局 <!-- 上面的搜索框 --> <com.example.editablealphalist.widgget.ClearEditText android:id="@+id/filter_edit" android:layout_marginTop="5dip" android:layout_width="match_parent" android:layout_height="wrap_cont

我们在开发过程中兰冕会有选着城市地点等东西,这些都是常用的东西,所以我也就将他封装起来了先来看看效果吧 1.首先看下项目的结构: 2.看下整体的项目效果 三:主ativity private Context context = LetterSortActivity.this; private ClearEditText mClearEditText; private TextView tv_mid_letter; private ListView listView; private MyLett

一.概述 ListView字母导航排序,网上已经有很多代码和博客了, 这篇博文也是照搬网上的.  之所以写到这里,不是为了说明什么,只是为了以后自己查阅方便.本来公司要求实现expandablelistview + 字母导航的, 这里先抄袭一下 ListView的 字母导航, 此处没有实现挤压效果. 二.代码 package com.example.sortlistview; import android.content.Context; import android.graphics.Canv

一,canvas元素 1 为了防止浏览器不支持canvas元素,我们设置“后备内容”(fallback content),下面紫色的字即为后备内容 <canvas id="canvas" width="600" height="300">您的浏览器不支持canvas,可以选择升级您的浏览器</canvas> 2 开发基于canvas的应用程序的最基本的几个操作 1),使用document.getElementById()方

鼠标事件 canvas.onmousedown = function(e ) {//React to the mouse down event }; canvas.addEventListener('mousedown', function(e ) { //React to the mouse down event}); 上面一种方法看起来更简单一些,但是,如果需要向某个鼠标事件注册多个监听器的话,那么用addEventListener()方法会更合适. 浏览器通过事件对象传递给监听器的鼠标坐标

马上就要"十一"国庆节了,又恰逢公司已经三周岁了,所以市场部和产品共同策划了一个"正青春,共成长"的主题代言活动,准备在国庆节以及中秋节期间让公司员工和用户为公司代言,于是就有了技术部前端开发人员即本人为公司来开发这个主题代言活动页面. 开发要求: 1.用户可以从手机相册上传图片或拍照上传图片: 2.用户可以输入为公司代言的地点,如:我在:上海: 3.将用户输入的代言地点及活动二维码生成一张图片供用户保存到手机,以方便发送朋友圈或好友. 功能实现: 1.使用H5的i

对于 3D 机房来说,监控已经不是什么难事,不同的人有不同的做法,今天试着用 HT 写了一个基于 HTML5 的机房,发现果然 HT 简单好用.本例是将灯光.雾化以及 eye 的最大最小距离等等功能在 3D 机房中进行的一个综合性的例子.接下来我将对这个例子的实现进行解析,算是自己对这个例子的一个总结吧.整个例子因为没有设计师的参与,所以样式上可能比较简陋,但是在一些细节的地方,比如墙上的贴图.门框嵌入以及灭火器等等,都是尽可能地还原真实的场景,也是花了些心思做这个例子的! 本例地址:http:

网上的很多的教程都是通过更改TextView的属性进行跑马灯的设计.这样做有很多的缺点: 1.如果TextView没有获取焦点,那么跑马灯的效果无法实现. 2.如果文本长度小于TextView的宽度,跑马灯的效果无法实现. 3.需要设置很多属性,麻烦. 还有很多教程是通过重写TextView的方式使TextView获得焦点,但是没有解决上面的几个问题. 本教程也是通过重写TextView的方式,准确的说是通过重写View的方式实现跑马灯. 使用到的技术: 1.Paint的使用: 2.Canvas

对于 3D 机房来说,监控已经不是什么难事,不同的人有不同的做法,今天试着用 HT 写了一个基于 HTML5 的机房,发现果然 HT 简单好用.本例是将灯光.雾化以及 eye 的最大最小距离等等功能在 3D 机房中进行的一个综合性的例子.接下来我将对这个例子的实现进行解析,算是自己对这个例子的一个总结吧.整个例子因为没有设计师的参与,所以样式上可能比较简陋,但是在一些细节的地方,比如墙上的贴图.门框嵌入以及灭火器等等,都是尽可能地还原真实的场景,也是花了些心思做这个例子的! 本例地址:http:

canvas的图像变换api,可以帮助我们更加方便的绘画出一些酷炫的效果,也可以用来制作动画.接下来将总结一下canvas的变换方法,文末有一个例子来更加深刻的了解和利用这几个api. 1.画布旋转api 这里要先了解另一个api translate(x,y):重新定义画布上(0,0)的位置. 首先定义一个旋转的角度a,比如想要旋转45度. a=45*Math.PI/180 rotate(a):rotate的旋转参数是弧度.注意,旋转之前要先设定旋转的中心点. function cxt_rota

前言 HTTP 支持 GZip 压缩,可节省不少传输资源.但遗憾的是,只有下载才有,上传并不支持.如果上传也能压缩,那就完美了.特别适合大量文本提交的场合,比如博客园,就是很好的例子. 虽然标准不支持「上传压缩」,但仍可以自己来实现. Flash 首选方案当然是 Flash,毕竟它提供了压缩 API.除了 zip 格式,还支持 lzma 这种超级压缩.因为是原生接口,所以性能极高.而且对应的 swf 文件,也非常小. JavaScript Flash 逐渐淘汰,但取而代之的 HTML5,却没有提

一 .前言 一直在做PC端的前端开发,从互联网到行业软件.最近发现移动端已经成为前端必备技能了,真是不能停止学习.HTML5新增的一些东西,canvas是用的比较多也比较复杂的一个,简单的入门了一下,通过一个刮奖效果来学习. 二.canvas基础 本文的目标是做一个刮奖效果,但是如果都不知道canvas是怎么回事,那么肯定也无法进行下去,所以先讲讲canvas基础吧. 首先,该怎么理解canvas,思来想去,最好的理解办法应该就是把canvas理解为一个空白的画纸,一张你可以在上面画画的纸. 然

前言 在我的另一篇博文 Canvas坐标系转换 中,我们知道了所有的平移缩放旋转操作都会影响到画布坐标系.那在我们对画布进行了一系列操作之后,怎么再知道当前矩阵数据状态呢. 具体代码 首先请看下面的一段代码(下文具体解释代码作用): window.TrackTransform = function () { var svg = document.createElementNS("http://www.w3.org/2000/svg", 'svg'); var xform = svg.c

默认坐标系与当前坐标系 canvas中的坐标是从左上角开始的,x轴沿着水平方向(按像素)向右延伸,y轴沿垂直方向向下延伸.左上角坐标为x=0,y=0的点称作原点.在默认坐标系中,每一个点的坐标都是直接映射到一个CSS像素上. 但是如果图像的每次绘制都参考一个固定点将缺少灵活性,于是在canvas中引入“当前坐标系”的概念,所谓“当前坐标系”即指图像在此时绘制的时候所参考的坐标系,它也会作为图像状态的一部分.比如rotate旋转操作,改变当前坐标系也就是改变了rotate的参考点,试想下如果没有当

画布操作介绍 画布绘图的环境通过translate(),scale(),rotate(), setTransform()和transform()来改变,它们会对画布的变换矩阵产生影响. 函数 方法 描述 translate dx,dx 转换的量的 X 和 Y 大小 scale sx,sy 水平和垂直的缩放因子 rotate angle 旋转的量,用弧度表示.正值表示顺时针方向旋转,负值表示逆时针方向旋转. setTransform a,b,c,d,e,f 水平缩放,水平倾斜(与旋转有关),垂直倾

本文将引导你使用canvas和JavaScript创建一个简单的绘图程序. 创建canvas元素 首先准备容器Canvas元素,接下来所有的事情都会在JavaScript里面. <canvas id="canvasInAPerfectWorld" width="490" height="220"></canvas> 获取绘图环境 canvas元素本身没有任何外观,它就是一块空白画板,提供给JS的一套API,大部分的API都