By

@

  • 引入自定义资源，格式为@[package:]type/name
    最常见的资源引用
1
android:text="@string/hello"
  • 引入系统资源，格式为@android:type/name
1
android:textColor="@android:color/opaque_red"

@*

引用系统非public资源@*android:type/name

系统资源纷纷public和非public，生命在\platforms\android-8\data\res\values\public.xml

相比@android:type/name，@*android:type/name能够使用所有Android系统资源，不过Google官方不推介使用

?

?[namespace:]type/name这种方式用于引用当前主题中的属性值，这个属性值只能在style资源和XML属性中使用

1
android:textColor="?android:textDisabledColor"

@+

@+type/name，+表示在type中添加一条记录通常用于定义资源id

1
android:id="@+id/select"

By

遍历DOM

祖先

通过jQuery能够向上遍历DOM数，以查找元素的祖先

  • parent() 返回所选元素的直接父类
  • parents() 返回所选元素的所有祖先元素，知道根元素()
  • parentsUntil() 返回介于两个元素之间的所有祖先元素
1
2
3
$(function(){
	$("span").prantsUntil("div");
})

后代

jQuery能够向下遍历DOM树

  • children() 返回被选元素的所有子元素
  • find() 返回被选元素的后代元素，一路向下指导最后一个后代

同胞

jQuery能够在DOM中遍历元素的同胞元素

  • siblings() 返回被选元素的所有同胞元素
  • next() 返回被选元素的下一个同胞元素
  • nextAll() 返回被选元素的所有跟随的同胞元素
  • nextUntil() 返回介于两个给定参数之间的所有跟随的同胞元素
  • prev() 与next方向相反
  • prevAll() 与nextAll方向相反
  • prevUntil() 与nextUntil方向相反

jQuery Ajax

AJAX = Asynchronous JavaScript and XML
简单的说在不重载整个页面的情况下，AJAX通过后台加载数据，并在网页上进行显示

AJAX load

load()方法能够从服务器加载数据，并把返回的数据放入元素元素中

1
$(selector).load(URL,data,callback);

必选参数URL为希望加载的URL，可选的data参数规定了请求一同发送的查询字符串的键/值对集合，可选的callback是load方法完成后所执行的函数
回调函数有不同的参数

  • responseTxt 结果内容
  • statusTxt 调用的状态
  • xhr XMLHttpRequest对象
1
2
3
4
5
6
7
8
$("button").click(function(){
  $("# div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){
    if(statusTxt=="success")
      alert("External content loaded successfully!");
    if(statusTxt=="error")
      alert("Error: "+xhr.status+": "+xhr.statusText);
  });
});

By

jQuery DOM操作

DOM = Document Object Model(文档对象模型)
jQuery提供了一系列与DOM相关的方法，这使访问和操作元素和属性变得容易

获取HTML元素

获得内容

  • text() 设置或返回所选元素的文本内容
  • html() 设置或返回所选元素的内容(包括HTML标记)
  • val() 设置或返回表单字段的值
    以上的三个都拥有回调函数，由两个参数：被选元素列表中当前元素的下标以及原始值

获取属性

  • attr() 获取属性值
    设置属性
1
2
3
$("button").click(function(){
	$("# w3s").attr("href","http://www.baidu.com/");
});

同事设置多个属性

1
2
3
4
5
6
$("button").click(function(){
	$("# w3s").attr({
		"href":"http://www.sina.com.cn",
		"title":"Sina"
	})
})

attr()也通过回调函数，包含两个参数：被选元素列表中当前元素的下标，以及原始值

1
2
3
4
5
$("button").click(function(){
	$("# w3s").attr("href",function(i,origValue){
		return origValue + "/jquery";
	});
})

添加元素

  • append() 在被选元素的结尾插入内容
  • prepend() 在被选元素的开头插入内容
  • after() 在被选元素之后插入内容
  • before() 在被选元素之前插入内容
1
$("p").addend("Some appended text.")

删除元素

  • remove() 删除被选元素(以及子元素)
  • empty() 从被选元素中删除子元素
    remove()方法可以接受一个参数，允许对删除元素进行过滤
1
$("p").remove(".italic");	// 删除class="italic"的所有<p>元素

获取并设置CSS类

操作CSS

  • addClass() 向所选元素添加一个或多个类
  • removeClass() 从被选元素删除一个或多个类
  • toggleClass() 对被选元素进行添加/删除类的切换操作
  • css() 设置或返回样式属性
1
2
3
4
5
6
7
$("button").click(function(){
	$("h1,h2,p").addClass("blue");
	$("div").addClass("important");
	// $("div").addClass("important blue"); 添加多个类
	$("div").removeClass("blue");
	$("div").toggleClass();
})

css()方法

css("propertyname")

1
2
3
$("p").css("background-color");
$("p").css("background-color","yellow"); //设置属性
$("p").css({"background-color":"yellow","font-size":"200%"});	// 同时设置多个属性

尺寸

  • width() 设置或返回元素的宽度(不包含内边距，边框或外框)
  • height() 设置或返回元素的高度(不包含内边距，边框或外框)
  • innerWidth() 设置或返回元素的宽度(包含内边距)
  • innerHeight() 设置或返回元素的高度(包含内边距)
  • outerWidth() 设置或返回元素的宽度(包含内边距和边框)
  • outerHeight() 设置或返回元素的高度(包含内边距和边框)

By

开始

1
2
3
dependencies {
  compile 'com.facebook.fresco:fresco:0.1.0+'
}

使用

简单的下载网络图片

  • 在Application中初始化
1
Fresco.initialize(context);

在XML中使用SimpleDraweeView，需要键入命名空间xmlns:fresco="http://schemas.android.com/apk/res-auto"

1
2
3
4
5
<com.facebook.drawee.view.SimpleDraweeView
	android:id="@+id/my_image_view"
	android:layout_width="20dp"
    android:layout_height="20dp"
    fresco:placeholderImage="@drawable/my_drawable" />

加载

1
draweeView.setImageURL("http://site.com/uri");

URLs

Fresco不支持相对路径，所有URL必须是绝对路径

类型 Scheme
远程图片 http://,https://
本地文件 file://
ContentProvider content://
asset目录下资源 asset://
res目录下资源 res://

更多请见http://fresco-cn.org/

By

JQuery是一个JavaScript函数库，包含以下功能：

  • HTML元素选取
  • HTML元素操作
  • CSS操作
  • HTML事件函数
  • JavaScript特效和动画
  • HTML DOM遍历和修改
  • AJAX
  • Utilties

jQuery安装

1
2
3
4
<head>
	<script src="jquery-1.10.2.min.js" />
	<!-- <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"> -->
</head>

语法

jQuery语法是通过选取HTML元素，并对选取的元素执行某些操作

基础语法

$(selector).action()

  • 美元符定义jQuery
  • 选取符(selector)查询和查找HTML元素
  • jQuery的action()执行元素的操作

文档就绪事件

1
2
3
$(document).ready(function(){
	// 为了防止文档在完全加载就绪之前运行jQuery代码
});

简洁的写法可以是这样的：

1
2
3
$(function(){
	//
});

选择器

jQuery选择器用于对HTML元素组或者单个元素进行操作
基于元素的id、类、类型、属性、属性值等”查找”HTML元素
所有选择器都以美元符开头：$()

  • 基于元素名选取元素
1
2
3
4
5
$(function(){
	$("button").click(function(){
		$("p").hide();
	})
})
  • 基于id选择
1
2
3
4
5
$(function(){
	$("button").click(function()){
		$("# test").hide();
	}
})
  • 基于class选择
1
2
3
4
5
$(function(){
	$("button").click(function(){
		$(".test").hide();
	});
})

更多实例

语法 描述
$(“*”) 所有元素
$(this) 当前元素
$(“p.intro”) class为intro的<p>元素
$(“p:first”) 第一个<p>元素
$(“ul li:first” <ul>元素的第一个<li>元素
$(“ul li:first-child” 每一个<ul>元素的第一个<li>元素
$(“[href]”) 选取所有带href属性的元素
$(“a[target=’_blank’]”) 所有target属性不等于"_blank"的<a>元素
$(“a[target!=’_blank’]”) 选取所有 target 属性值不等于 "_blank"的 <a>元素
$(“:button”) 选取所有 type=”button” 的<input>元素和<button>元素
$(“tr:even”) 选取偶数位置的<tr>元素
$(“tr:odd”) 选取奇数位置的<tr>元素

jQuery事件

鼠标事件 键盘事件 表单事件 文档/窗口事件
click keypress submit load
dblclick keydown change resize
mouseenter keyup focus scroll
mouseleave blur unload

常用事件

  • $(document).ready() 文档准备完毕
  • click() 按钮点击事件
  • dblclick() 双击元素事件
  • mouseenter() 当鼠标指针穿过元素时
  • mouseleave() 当鼠标离开元素时
  • mousedown() 当鼠标移动到元素上并按下鼠标时
  • mouseup() 当鼠标移动到元素上并松开鼠标时
  • hover() 模拟光标悬停事件
  • focus() 元素获得焦点事件
  • blur() 元素失去焦点事件

hide()和show()

用于元素的隐藏和显示

1
2
$(selector).hide(speed,callback)	//speed 可以使slow fast或毫秒用于规定隐藏/显示的速度
$(selector).show(speed,callback)

toggle()

用于切换hide()和show()

1
$(selector).toggle(speed,callback)

淡入淡出效果

  • fadeIn()
  • fadeOut()
  • fadeToggle()
  • fadeTo()
1
$(selector).fadeIn(speed,callback);

fadeIn为淡入，fadeOut为淡出，fadeToggle()为切换
fadeTo允许为给定的不透明度(值为0到1之间)

1
$(selector).fadeTo(speed,opacity,callback)

滑动效果

1
2
3
$(selector).slideDown(speed,callback)	// 用于向下滑动元素
$(selector).slideUp(speed,callback)
$(selector).slideToggle(speed,callback)

自定义动画

1
$(selector).animate({params},speed,callback);

params为定义形成动画的CSS属性

1
2
3
$("button").click(function(){
  $("div").animate({left:'250px'});
});

也可以同时操作多个属性

1
2
3
4
5
6
7
8
$("button").click(function(){
  $("div").animate({
    left:'250px',
    opacity:'0.5',
    height:'150px',
    width:'150px'
  });
});

使用相对值

1
2
3
4
5
6
7
$("button").click(function(){
  $("div").animate({
    left:'250px',
    height:'+=150px',
    width:'+=150px'
  });
});

使用预定值

1
2
3
4
5
$("button").click(function(){
  $("div").animate({
    height:'toggle'
  });
});

使用队列

1
2
3
4
5
6
7
$("button").click(function(){
  var div=$("div");
  div.animate({height:'300px',opacity:'0.4'},"slow");
  div.animate({width:'300px',opacity:'0.8'},"slow");
  div.animate({height:'100px',opacity:'0.4'},"slow");
  div.animate({width:'100px',opacity:'0.8'},"slow");
});

停止动画

stop()方法用于停止动画或效果
$(selector).stop(stopAll,goToEnd)
可选的stopAll指定是否应该清除动画队列，默认是false，即仅停止活动的动画，允许任何排入队列的动画向后执行
可选的goToEnd参数指定是否立即完成当前动画，默认是false

1
2
3
$("# stop").click(function(){
  $("# pancel").stop();
});

By

准备工作

  1. 下载NDK
  2. 配置环境变量，在~/.bash_profile文件下添加
1
2
3
#  根据自己存放的位置指定
export NDK_ROOT=/Users/UserName/Documents/Android/android-ndk-r10
export PATH=$NDK_ROOT:$PATH

新建一个项目

创建一个MathKit类

1
2
3
4
5
6
7
public class MathKit {
	public static native int square(int num);

	static {
		System.loadLibrary("JniDemo");
	}
}

在命令行中进入目录，使用javah命令生成.h文件

将.h文件存放至jni文件夹下，并新建.cpp文件

根据头文件，编写cpp文件

1
2
3
4
5
6
7
# include <com_zoe_ndkdemo_jni_MathKit.h>

JNIEXPORT jint JNICALL Java_com_zoe_ndkdemo_jni_MathKit_square
  (JNIEnv * env, jclass cls, jint num)
  {
    return num * num;
  }

在local.properties文件添加ndk路径

1
ndk.dir=/Users/UserName/Documents/Android/android-ndk-r10

在app项目中的build.gradle中的defaultConfig中添加

1
2
3
ndk {
	moduleName "JniDemo"
}

之后就可以在代码中调用

1
2
3
4
5
6
7
8
9
private TextView textView;

@Override
protected void onCreate(Bundle savedInstanceState) {
   super.onCreate(savedInstanceState);
   setContentView(R.layout.activity_main);
   textView = (TextView) findViewById(R.id.text);
   textView.setText("2*2="+ MathKit.square(2));
}

示例：https://github.com/SeniorZhai/NdkDemo