曾经，作为一个使用 Eclipse 的 Android 开发，一直很羡慕 Xcode 里面那个 Storyboards 的工具，不管实际上好不好用，看着就是各种高大上啊，有木有。终于，在转到 Android Studio 之后，我们有了 Navigation Editor，从此以后就不用羡慕嫉妒恨了。
什么是 Navigation Editor
Navigation Editor 与 Storyboards 同样是一个可视化创建和浏览 Android 应用的结构和布局文件的工具。开发者可以使用 Navigation Editor 来快速创建应用原型。同时，设计师也可以在不用写任何代码的情况下在真实设备上查看他们的设计成果。无论如何这个工具能够让设计师和开发能够有更好的协作。
怎样启动 Navigation Editor
在 Android Studio 菜单中，选择 Tools -> Android -> Navigation Editor。
之后 build 过程如果没有问题的话，那么就能够看到如下的界面。
怎样使用 Navigation Editor
在 Navigation Editor 中你可以：
- 创建新的 Activity -鼠标右键
- 编辑每个 Activity 的布局-鼠标双击
- 添加从控件(例如，Button 和 Menu Item)到其他 Activity 的交互-按住 Shift 拖动控件(Ctrl/Alt 也可以)
之后只要像通常一样点 Run 就可以在真机上运行了。
Navigation Editor 是如何工作的
Navigation Editor 直接生成处理普通的 Android 资源文件。
Navigation Editor 会检查 AndroidManifest 文件，Java 代码，Layout 和其他的资源文件来生成应用的结构图。结构图中包括了用户能看到的 Activities 和 Fragments，以及它们之间交互。如果项目是完全由 Navigation Editor 生成的，那么这个结构图会十分完整，但是如果要手动对代码进行调整，那么必须采用 Navigation Editor 能够处理的模式，才能在结构图中显示出完整的交互。不过，很遗憾，它支持的模式估计能难满足一般的开发需要。当然，这只是目前的版本，在以后的版本中，可能会去掉这个限制。模式介绍可以查看这里。
目前 Navigation Editor 能识别的模式
之后的代码示例将采用以下约定：
- $token: 变量
- token: 关键字
- statement*: Java语句
Activity/Fragment -> Layout Resource
布局文件和 Activity/Fragment 的关联：
Activities
void onCreate(Bundle $bundle) {
statement*
setContentView($R.layout.$id);
statement*
}
Fragments
View onCreateView(LayoutInflater $inflater, ViewGroup $viewGroup, Bundle $bundle) {
statement*
$inflater.inflate($R.layout.$id, $container, false);
statement*
}
Activity/Fragment -> Menu
Menu 和 Activity/Fragment 的关联：
boolean onCreateOptionsMenu(Menu $menu) {
statement*
getMenuInflater().inflate($R.menu.$id, $menu);
statement*
}
MenuItem:itemClick()
Activities/Fragments 以及他们关联的 menus，menuitems 和界面切换的绑定：
boolean onPrepareOptionsMenu(Menu $menu) {
statement*
$menu.findItem($R.id.$menuId).setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem $menuItem) {
$activity.startActivity(new Intent($activity, $DestinationActivity.class));
return $consume;
}
});
statement*
}
View:click()
普通的 Views(例如 Buttons)和界面切换的绑定：
void onCreate(Bundle $bundle) {
statement*
findViewById($R.id.$id).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View $view) {
$activity.startActivity(new Intent($activity, $DestinationActivity.class));
}
});
statement*
}
ListView:onItemClick()
ListViews 和界面切换的绑定：
ListFragment
void onViewCreated(View $view, Bundle $bundle) {
statement*
getListView().setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView> $parent, View $view, int $position, long $id) {
[$statement;]*
$activity.startActivity(new Intent($activity, $DestinationActivity.class)); [statements may be embedded here]
[$statement;]*
}
});
statement*
}Master-Detail 模式
由 Android Studio 的模板系统里的 ‘Master-Detail’ 模板生成的代码也能够被识别和处理。
总结
基本来说，目前这个工具在实际开发的过程中用处可能不大，更大的用处还是在于前期原型的快速搭建上面。这个其实也很悲剧的与 Storyboards 的处境相似。对此我们也只能期待这个工具在以后的版本中功能更加强大了。
