Monthly Archives: 五月 2012

Hello World

Xcode部署phoneGap

前在android-eclipse内搞phoneGap项目,照着phoneGap官网的“开发入门”,很容易就部署成功了helloword项目~~~java的最大优势:什么东西都可以一个jar包搞定

但今天搞phoneGap ios项目却颇废了一番周折,究其原因,一来是第一次搞xcode,不熟悉;二来是phoneGap官网的ios“开发入门”写的真不什么样,云里雾里

下面把关键的几步说一下:

1. 下载最新的phoneGap,安装里面的ios/PhoneGap-x.dmg

2. 打开xcode,“new project”,选择“phoneGap-based Application”,新建你的项目

3. 点击左上角的“Run”,这时,会打开iphone模拟器,打开你的项目,显示找不到index.html的错误~~经过这一步,你的项目目录下会生成www目录,但还不会出现在xcode中

4. 在xcode的左侧项目导航中,选择你的项目,按住ctrl,右击,选择“Add Files To “helloword””,在弹出菜单中,将你项目下的www目录添加到项目中,下方的“folders”选择“Create Folder References For Any Added Folders”,“Add”,此时,左侧项目导航中会出现xcode

5. 这是再点击左上角的Run,在模拟器中可以看到刚才添加的index.html中的内容

6. 貌似,在xcode的左侧项目导航中,是无法在www目录下建立文件夹和js、html等文件的,别急,可以直接Finder窗口中打开www目录,然后新建这些东西,xcode会立即显示出来,你就可以在其中编辑它啦

————

参考:http://mobile.51cto.com/web-334924.htm

日志

mac换硬盘

macbook用了快三年了,250G的硬盘一直用的紧紧巴巴的,剩余空间从来没有多于30G,电影、照片不敢多放(作为一个比较恋旧的人,这一点很痛苦),双系统也装不了(作为一个喜欢玩游戏的人,更痛苦)~~~~换硬盘!

开始时也考虑要不要干脆搞个SSD的,速度快,还时髦,但容量太小,价格太高,也就作罢了,还是保守点吧
本来准备直接换1T的,但看1T的2.5硬盘只有日立的,评价也不怎么好~~~750G也还可以

硬件方面,给mac换硬盘,和给其他电脑换硬盘并没有什么差别:打开后盖,拧开螺丝,换上新硬盘,装上后盖~~~ok
换硬盘最关心的还是原硬盘内的东西能不能安全的复制到新硬盘上。以前用win的时候,换硬盘的时候顺便做了新系统系统,然后把旧硬盘装到硬盘盒里,把东西倒过去,再把应用重装一遍~~但是这个过程实在太麻烦了~~特别是已经做了将近三年的系统
与win不同,mac系统内置了很多可以方便备份、迁移的工具,可以轻而易举的将整个硬盘内的东西原封不动“搬迁”到新硬盘,下面大概说一下迁移的步骤(顺便说一句,这里说的是之前没使用time machine的步骤,如果之前一直在用time machine,会比下面的步骤省事的多):

  1. 买硬盘~~废话,难道自己造一个~~这里是说,买硬盘的时候刷便买了移动硬盘盒~~40多块,不仅备份系统的时候要用,以后也可以直接把旧硬盘做成移动硬盘
  2. 先将新硬盘放到移动硬盘盒里,连到电脑上,进入磁盘工具,为其分两个区,比如分别叫做mac、time,分区方式采用默认分区即可;打开time machine,”选择磁盘”,选择“time”,使用time machine备份~~这个过程比较慢,我的旧硬盘里200多G的东西,用了大概8个小时
  3. 确定备份完了以后,将新硬盘换到电脑内,开机;找到你的mac系统安装光盘,塞进去,进入mac安装工具/磁盘工具,按照提示一步一步选择恢复系统,恢复源选择time,将新系统通过time machine从time分区,恢复到mac分区,这个过程大概用了5个小时
  4. 完了以后,重启开机(记得拿出光盘),检查一下原来的东西是不是都搬过来了~~除了了容量大了、速度快了,其他一模一样~~ok,time machine的使命结束了,打开磁盘工具,选择物理硬盘/分区,将time分区删掉,将其空间合并到主分区内~~over

最后去掉time分区的这一步,看你实际需要,这种备份方式倒是很方便,不用插USB,time machine会自动备份;不过个人感觉,将备份和系统放在同一个物理磁盘上,备份的价值就大打折扣了

另一个需要注意的问题是,之前看到的一篇文章说,如果系统做过升级,比如现在的系统是狮子,但系统光盘是雪豹,用上面的方式可能是不行的,需要先用光盘装上雪豹,再升级到狮子,最后再用time machine恢复

Hello World

jqm如何刷新已经加载的页面

jquery mobile自带丰富的ui组件,更有codiqa提供了可视化的在线html生成工具,使用起来及其方便,很容易就可以搭建出漂亮的前端应用。

使用jqm的标准书写的组件,在其母“page”被加载时,jqm会将这些组件附加更加丰富的样式以及基础的事件处理程序,包括各种列表样式、icon、页面转场效果等等

但过度智能化也的使得使用中碰上了一个绕不开的问题,两周以来一直没找到好的解决办法:上面说,只有当一个page被加载时,jqm才会对html组件进行处理,附加样式和时间,而page一旦被加载过,再对这个page的内容进行修改,jqm就不会再对它做处理了,也用不了jqm的样式。

开始的时候,试了“$.mobile.initializePage()”,但是它只对第一个page的第一次加载有效,否则除非重新刷新页面页面。

然后又将希望寄托在“$.mobile.changePage(page, optional);”,但是只有当page是一个url地址时,被加载的页面才可会被jqm处理。

找遍了jqm中文和英文的api也再没有发现更好的办法

……….

今天,无意中,在一个叫做“移动互联网”的QQ群里看到了解决方法:“$(page).trigger(“pagecreate”);”~~~~有效!

pagecreate:jqm自定义的事件,页面初始化时,初始化之后触发

使用trigger(“pagecreate”)也就是强制jqm再对page做一次初始化

———————

倒塌集

脑残的本本设计

专门给左撇子设计的本本

堆积的接口


————-

参考:http://tech.ifeng.com/digi/nbook/evaluation/detail_2012_05/21/14686554_0.shtml

Hello World

简单实用的js模板引擎

不足50行的js模板引擎,支持各种js语法:

<script id="test_list" type="text/html">
<%=
	for(var i = 0, l = p.list.length; i < l; i++){
		var stu = p.list[i];
=%>
	<tr>
		<td<%=if(i==0){=%> class="first"<%=}=%>><%==stu.name=%></td>
		<td><%==stu.age=%></td>
		<td><%==(stu.address || '')=%></td>
	<tr>
 
<%=
	}
=%>
</script>

“<%= xxx =%>”内是js逻辑代码,“<%== xxx =%>”内是直接输出的变量,类似php的echo的作用。“p”是调用下面build方法时的k-v对象参数,也可以在调用“new JTemp”时设置成别的参数名

调用:

$(function(){
	var temp = new JTemp('test_list'),
		html = temp.build(
			{list:[
           		{name:'张三', age:13, address:'北京'},
        		{name:'李四', age:17, address:'天津'},
        		{name:'王五', age:13}
        	]});
	$('table').html(html);
});

上面的temp生成以后,可以多次调用build方法,生成html

一下是模板引擎的代码:

var JTemp = function(){
	function Temp(htmlId, p){
		p = p || {};//配置信息,大部分情况可以缺省
		this.htmlId = htmlId;
		this.fun;
		this.oName = p.oName || 'p';
		this.TEMP_S = p.tempS || '<%=';
		this.TEMP_E = p.tempE || '=%>';
		this.getFun();
	}
	Temp.prototype = {
		getFun : function(){
			var _ = this,
				str = $('#' + _.htmlId).html();
			if(!str) _.err('error: no temp!!');
			var str_ = 'var ' + _.oName + '=this,f=\'\';',
				s = str.indexOf(_.TEMP_S),
				e = -1,
				p,
				sl = _.TEMP_S.length,
				el = _.TEMP_E.length;
			for(;s >= 0;){
				e = str.indexOf(_.TEMP_E);
				if(e < s) alert(':( ERROR!!');
				str_ += 'f+=\'' + str.substring(0, s) + '\';';
				p = _.trim(str.substring(s+sl, e));
				if(p.indexOf('=') !== 0){//js语句
					str_ += p;
				}else{//普通语句
					str_ += 'f+=' + p.substring(1) + ';';
				}
				str = str.substring(e + el);
				s = str.indexOf(_.TEMP_S);
			}
			str_ += 'f+=\'' + str + '\';';
			str_ = str_.replace(/\n/g, '');//处理换行
			var fs = str_ + 'return f;';
			this.fun = Function(fs);
		},
		build : function(p){
			return this.fun.call(p);
		},
		err : function(s){
			alert(s);
		},
		trim : function(s){
			return s.trim?s.trim():s.replace(/(^\s*)|(\s*$)/g,""); 
		}
	};
	return Temp;
}();

核心是将模板代码转变成了一个拼接字符串的function,每次拿数据call这个function。

因为主要是给手机(webkit)用的,所以没有考虑字符串拼接的效率问题,如果需要给IE实用,最好将字符串拼接方法改为Array.push()的形式