Starting Another Activity

这一课要实现点击Send Button开启新的Activity。

创建新的Activity


  1. 右键你的activity所在目录,如图选择新建空Activity
    Starting Another Activity 01
  2. 填写相关File name,如图
    Starting Another Activity 02
  3. 点击Finish

值得注意的是,这里除了创建了选项中的相关文件外,还做了两件事

  • 自动实现了DisplayMessageActivity的onCreate方法,并且setContentView,将布局文件与Activity连接在一起。
  • 在Manifest配置文件中添加了以下代码
    1
    2
    3
    4
    5
    6
    7
    8
    <activity
    android:name=".DisplayMessageActivity"
    android:label="@string/title_activity_display_message"
    android:parentActivityName=".MyActivity" >

    <meta-data
    android:name="android.support.PARENT_ACTIVITY"
    android:value="com.shawn.androidtrainingdemo.MyActivity" />

    </activity>

意思是在配置中声明一个Activity,parentActivityName指actionbar左上角返回按钮的点击后要返回的上级页面,只适用于API 16及更高,若要在更低版本实现这个效果,可以使用support v7包以及添加对应的meta-data。现在的AS非常智能,对于自动添加相关依赖的功能非常完善,所以我们只管写上相关代码,就会自动生成依赖。

为之前添加的Send按钮添加事件


  1. 回到activity_my.xml布局中,修改button如下

    1
    2
    3
    4
    5
    <Button
    android:onClick="sendMessage"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/button_send" />

  2. 打开MyActivity.java文件,添加对应sendMessage方法

    1
    2
    3
    4
    /** Called when the user clicks the Send button */
    public void sendMessage(View view) {
    // Do something in response to button
    }

这是一种特殊写法,若想点击事件能顺利执行,方法必须满足

  • 方法为public
  • 返回为void
  • 参数只能有1个,为View类型,而传入的对象即为被点击的Button对象

建立Intent


1. 创建Intent

An Intent is an object that provides runtime binding between separate components (such as two activities). The Intent represents an app’s “intent to do something.” You can use intents for a wide variety of tasks, but most often they’re used to start another activity.
顾名思义,intent指”要去做什么”,它适用多种任务场景,这里我们用来在两个Activity之间通信。

1
Intent intent = new Intent(this, DisplayMessageActivity.class);

Intent构造函数包含两个参数,第一个为Android特有的上下文Context token,Activity是Context子类,所以我们用this,第二个为要使用这个Intent的组件类对象。(这里采取硬编码方式,是Intent提供的一种更高效的方式)

2. 通过findViewById()方法找到EditText,并得到其中的文字

1
2
EditText editText = (EditText) findViewById(R.id.edit_message);
String message = editText.getText().toString();

这里用到的R.id.edit_message是之前我们在布局文件中定义,并在R文件中自动生成的对应id。

3. 将信息存入Intent

Intent可以以key-value形式存储信息,称为extras

1
intent.putExtra(EXTRA_MESSAGE, message);
1
2
3
public class MyActivity extends ActionBarActivity {
public final static String EXTRA_MESSAGE = MyActivity.class.getSimpleName();
...

我们在Activity通信中或者日常的Log中经常会用到本类的类名来唯一标示一些信息,如上面的代码。

4. 启动DisplayMessageActivity

1
startActivity(intent);

完整代码如下

1
2
3
4
5
6
7
public void sendMessage(View view) {
Intent intent = new Intent(this, DisplayMessageActivity.class);
EditText editText = (EditText) findViewById(R.id.edit_message);
String message = editText.getText().toString();
intent.putExtra(EXTRA_MESSAGE, message);
startActivity(intent);
}

处理收到的Message


打开DisplayMessageActivity.java,在OnCreate方法内添加如下代码

1
2
3
4
5
6
7
8
9
10
11
// Get the message from the intent
Intent intent = getIntent();
String message = intent.getStringExtra(MyActivity.EXTRA_MESSAGE);

// Create the text view
TextView textView = new TextView(this);
textView.setTextSize(40);
textView.setText(message);

// Set the text view as the activity layout
setContentView(textView);
  1. 通过getIntent得到传入的Intent,通过个Message的key找到相关信息
  2. 通过代码形式创建一个TextView(纯显示类文字控件),设置字体大小40px,文字内容为传入的message
  3. 设置这个Activity的contentView为刚刚创建的TextView

需要注意的是
这里我们用代码形式生成控件,只是展示另外一种创建控件的方法,但是这样增加了布局与Java代码的耦合,不利于今后的迭代,所以还是推荐在XML中创建控件,并通过ID来操作控件

运行App,并输入些内容,点击send按钮,观察效果。

Building A Simple User Interface

这一节开发交互界面,交互界面抽象成了XML文件,在/res/layout目录下。
android框架提供了大量UI组件提高开发效率
Building A Simple User Interface 01
但是在Training的章节里不对每个技术细节做详细的介绍,我们首先要做出一个APP来

Declaring your UI layout in XML rather than runtime code is useful for several reasons, but it’s especially important so you can create different layouts for different screen sizes. For example, you can create two versions of a layout and tell the system to use one on “small” screens and the other on “large” screens.
这也是之前提到的,为了更好的适配和更方便的管理,把资源文件抽象出来的一种体现

创建LinearLayout(线性布局)

LinearLayout是ViewGroup的一个子类,管理的View对象呈线性分布。

  1. /res/layout下找到,并打开,应该是这个样子的,如图
    Building A Simple User Interface 02
    底部有DesignText视图可以切换,一般保持在Text视图,把右侧Preview选项打开即可。
    这里现在是自动生成的代码,包括一个root view RelativeLayout和一个TextView,里面不出意外是”Hello World“
  2. 现在我们把这些代码全部删掉,加入以下代码
    1
    2
    3
    4
    5
    6
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    </LinearLayout>
  • android:orientation="horizontal":表示LinearLayout控制的布局是横向分布的
  • android:layout_width="match_parent"android:layout_height="match_parent":该View在父布局中的宽和高,这是我们可以控制的根布局,所以选择match_parent来填充整个屏幕

添加EditText

在LinearLayout标签内添加如下代码

1
2
3
4
<EditText android:id="@+id/edit_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="@string/edit_message" />

  • 为EditText配置一个id:edit_message
  • 宽和高为wrap_content,意思是包裹内容,也就是恰好内部文字的宽和高
  • android:hint是专属EditText控件的属性,表示用户未输入时的提示文字
  • res/values/strings.xml中添加edit_message的string资源
    1
    2
    3
    4
    5
    6
    7
    <resources>
    <string name="app_name">AndroidTrainingDemo</string>
    <string name="edit_message">Enter a message</string>
    <string name="button_send">Send</string>
    <string name="hello_world">Hello world!</string>
    <string name="action_settings">Settings</string>
    </resources>

android:id

  • 这个View控件的唯一标示。@表示引用资源变量,id是一个特殊的资源变量,第一次引用的时候使用+,表示创建一个新的id。
    id是一种特殊的资源,还有其他普通的资源,比如bitmap,layout文件,string变量等等。
    id可以在引用的地方直接声明,而其他资源需要在对应的目录配置,或者生成文件,比如string变量在values/strings中声明,layout的id在生成layout文件时生成,而所有资源变量都会被SDK TOOLS在编译时生成在gen/R.java中,可以在app/build/generated/source/r/debug/com/shawn/androidtrainingdemo/R.java中,该文件都是根据资源文件自动生成,切勿手动修改
  • EditText的view id与hint的string资源变量名是一样的,但并不影响,因为资源的引用往往是跟随类型的,一种是id类型,一种是string类型,观察R.java同样可以发现这个区别

Building A Simple User Interface 03

添加Button

代码如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >

<EditText android:id="@+id/edit_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="@string/edit_message" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/button_send" />

</LinearLayout>

其他与添加EditText一样,android:text是继承自TextView的属性,表示控件的label。

调整布局

这个时候我们发现preview显示,Button右侧还有部分空白,两个控件并没有横向填满屏幕。可以通过android:layout_weight来控制。
android:layout_weight

  • 表示LinearLayout中子View的权重。顾名思义,表示子View在父布局中占几份,如果只有一个View加上了这个属性,效果就是渲染完其他子View之后,将该View填充剩下的部分,如果有一个以上的View使用了该属性,则按份数来划分,比如一个为1,一个为2,则总份数为3,那么其他子View渲染结束后,剩下部分划分为3份,第一个占1份,第二个占2份,另外还可以在LinearLayout中加入android:weightSum来控制总份数,但是一般不太需要刻意配置。

    在设置了android:layout_weight之后,可以将width或者height设置为0dp来提高渲染速度,因为设置权重之后的宽度依赖于其他子View,所以配置宽度并没有意义

preview如下
Building A Simple User Interface 04

最后运行APP

经验尚欠,希望各位看官多加指正,或通过邮件联系我

Running Your App

在真机运行


设置真机

  1. 准备android usb线(这不废话么。。),如果是windows系统,还需要安装手机驱动,各种厂家的驱动在这里可以找到:OEM USB Drivers
  2. 打开设备上的USB Debug选项
  • 3.2及之前版本在 Settings > Applications > Development
  • 4.0及之后版本在 Settings > Developer options

    Note: On Android 4.2 and newer, Developer options is hidden by default. To make it available, go to Settings > About phone and tap Build number seven times. Return to the previous screen to find Developer options.
    就是连续点7次版本号才会有,但是国内厂商各种做,没准怎么样,总之在关于手机里各种点好了,Orz..

AS运行APP

点击工具栏的按钮就可以运行了。

有个坑,就是运行之前的配置,有些小同志不注意的话会碰到怎么也跑不起来的问题,首先如图点击Edit Configurations
Running Your App 02
配置如下
Running Your App 03
特别是Target Device,我选的是choose dialog,可以根据个人喜好选,但是如果运行项目有问题,可以回来检查下这里的配置

Command Line运行APP

1. 生成APK

先进入项目根目录下
windows用户

1
$ gradlew.bat assembleDebug

mac 或 linux用户

1
2
$ chmod +x gradlew
$ ./gradlew assembleDebug

运行结果不截图了,有些人可能第一次执行会卡在download gradle中,应该是网络问题,2015年之后我还没碰到过不翻墙就下不了gradle的问题
成功后,apk会在app/build/outputs/apk/生成

assembleDebug对应生成的是Debug Mode的APK
assembleRelease对应生成的是Release Mode的APK

2. 安装APK

1
$ adb install app/build/outputs/MyFirstApp-debug.apk

当然要保证sdk/platform-tools在你的PATH中

虚拟机运行APP


首先确保安装了HAXM(Hardware Accelerated Execution Manager),可以在SDK MANAGER中找到,如图
Running Your App 04

1. 创建虚拟机

可以使用command line打开AVD Manager(Android Virtual Device Manager)

1
$ ./android avd

也可以在AS的toolbar中找到
Running Your App 05

具体流程在这里不多介绍了,因为官方的AVD确实不好用,现在基本都在用Genymotion

2. 运行APP

  • command line方式

    1
    $ adb install app/build/outputs/MyFirstApp-debug.apk
  • AS方式
    choose dialog中选择你创建的虚拟机就可以了。

Creating an Android Project

顾名思义,这一章教你如何创建一个 Android项目,当然前提是你最好使用Android Studio,以后简称AS,那些还在用ADT不知道什么心态,google早就不支持了。

Android Studio 创建项目


1.创建新项目

  • 如果在欢迎界面,点击New Project
  • 如果在项目界面,点击File -> New -> New Project
    都会弹出以下界面
    Creating an Android Project 01

2.填写相关项

  • Application Name:项目名字,这里选用AndroidTrainingDemo
  • Company Domain:公司域,AS会记忆这个字段
  • Package Name:项目的包名,这个字段是根据以上两项组合而成,遵循Java机制

    Your package name must be unique across all packages installed on the Android system.
    生成的包名在用户机器上必须是唯一的,这也是保证将来APP上传到市场上时,唯一迭代的其中一个依据。

  • Project Location:项目保存路径,看心情好了。
    然后点击Next
    Creating an Android Project 02

3.选择版本

这里有4个选项,Phone and Tablet,TV,Wear,Glass
我们选择第一个,也就是适配手机或者平板
这里选择的是支持的最低版本,也就是选择的版本之上都可以支持(高版本具有更多新特性,在支持更多的机型和使用更新的特性上需要一些数据来权衡),更多请查看API LEVEL,当然如果支持的版本过低,又想使用新特性,可以用代码控制

1
2
3
4
5
6
7
private void setUpActionBar() {
// Make sure we're running on Honeycomb or higher to use ActionBar APIs
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
ActionBar actionBar = getActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
}
}

详见 Supporting Different Platform Versions
界面上显示了Google Play上的数据是4.0以上版本的机器占90%,刚才查了一下友盟的数据,基本上选择4.0以上版本就可以了,2.3的时代终于过去了!

Creating an Android Project 03
点击next

4.添加一个Activity

Creating an Android Project 04
选择 Blank Activity 点击next
设置相关资源文件名,如图
Creating an Android Project 05
然后点击Finish,项目就建好了。

5.目录结构

Creating an Android Project 06

app/src/main/java/com.mycompany.myfirstapp/MyActivity.java

  • 我们创建的第一个Activity

app/src/main/res/layout/activity_my.xml

  • Activity对应的布局文件,也就是手机上的页面布局

app/src/main/AndroidManifest.xml

  • 可以暂时简单理解为项目的配置文件

app/build.gradle

  • AS是用Gradle打包编译的。每个module都有一个build.gradle文件,另外,整个项目也有一个build.gradle文件,我们最关心的还是module的build.gradle文件,因为里面放着相关依赖配置以及其他默认配置,module常见的分为两类,一个app module,一个library module,顾名思义,一个app的模块,一个库模块,在build.gradle顶部,通过apply plugin: 'com.android.application'apply plugin: 'com.android.library'区分,这个项目只有一个app模块。

Creating an Android Project 07
compiledSdkVersion
编译版本,默认使用最新的API LEVEL,以便你能使用更多新特性,更多的API版本可使用SDK Manager来下载和管理,SDK Manager可以在工具栏中找到
Creating an Android Project 08
applicationId
项目包名,也就是上面提到的唯一标示你APP的东西
minSdkVersion
在之前设置过的,项目支持的最低版本
targetSdkVersion
官方给出的说明是通过这个字段来测试是否兼容新版本,需要跟最新API LEVEL同步,暂时可以简单理解为你能使用的新特性的上限版本
顺便提一下,以前的android开发是修改manifest来更改配置的,自从引入gradle之后,一部分配置被迁移到了build.gradle,所以manifest的部分配置是gradle根据配置来生成

有些以下是资源文件,在/res目录下

drawable<density>/
存放图片资源文件的目录,比如bitmap,还可以根据不同的像素密度dpi分目录管理,这个以后再提,官方文档可能还没有更新

Here you’ll find the ic_launcher.png that appears when you run the default app.

其实现在ic_launcher,也就是app桌面图标最好是放在mimmap目录下,貌似可以更好的渲染图标
layout/
存放项目的布局文件,也就是用户交互界面
menu/
存放每个页面的菜单布局,android的menu感觉一直很蛋疼,从当初的实体menu键,上拉menu,到actionbar,到toolbar,变化很快,很多项目也是自己来定义页面顶部titlebar的,所以这个目录经常被无视掉
values/
存放项目的一些其他资源值,比如字符串(用于多语言),色值,样式之类的,这样对项目的迭代维护起到了至关重要的作用。

我们知道移动端项目不只是纯代码,还有纷繁复杂的资源文件,google很聪明的用上面这种目录结构来把相关的资源抽象到单独的目录,方便了编译系统(android项目的编译流程会在其他章节介绍),也大大提高了开发效率。

Command Line Tools 创建项目


1.首先进入sdk/tools目录下

1
$ cd ~/Library/Android/sdk/tools

2.然后列出android版本

1
$ ./android list

Available Android targets:

id: 1 or “android-15”
Name: Android 4.0.3
Type: Platform
API level: 15
Revision: 5
Skins: HVGA, QVGA, WQVGA400, WQVGA432, WSVGA, WVGA800 (default), WVGA854, WXGA720, WXGA800

Tag/ABIs : default/armeabi-v7a, default/mips, default/x86

id: 2 or “android-16”
Name: Android 4.1.2
Type: Platform
API level: 16
Revision: 5
Skins: HVGA, QVGA, WQVGA400, WQVGA432, WSVGA, WVGA800 (default), WVGA854, WXGA720, WXGA800, WXGA800-7in

Tag/ABIs : no ABIs.

id: 3 or “android-17”
Name: Android 4.2.2
Type: Platform
API level: 17
Revision: 3
Skins: HVGA, QVGA, WQVGA400, WQVGA432, WSVGA, WVGA800 (default), WVGA854, WXGA720, WXGA800, WXGA800-7in
Tag/ABIs : no ABIs.
……

1
2
3
$ android create project --target <target-id> --name MyFirstApp \
--path <path-to-workspace>/MyFirstApp --activity MyActivity \
--package com.example.myfirstapp

替换target-id为上一步列表中的某个id,官方依然推荐最新版本,替换path-to-workspace为你的文件路径

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$ ./android create project --target 8 --name MyFirstApp --path ~/Documents/Code/android/MyFirstApp --activity MyActivity --package com.example.myfirstapp
Created project directory: /Users/shawn/Documents/Code/android/MyFirstApp
Created directory /Users/shawn/Documents/Code/android/MyFirstApp/src/com/example/myfirstapp
Added file /Users/shawn/Documents/Code/android/MyFirstApp/src/com/example/myfirstapp/MyActivity.java
Created directory /Users/shawn/Documents/Code/android/MyFirstApp/res
Created directory /Users/shawn/Documents/Code/android/MyFirstApp/bin
Created directory /Users/shawn/Documents/Code/android/MyFirstApp/libs
Created directory /Users/shawn/Documents/Code/android/MyFirstApp/res/values
Added file /Users/shawn/Documents/Code/android/MyFirstApp/res/values/strings.xml
Created directory /Users/shawn/Documents/Code/android/MyFirstApp/res/layout
Added file /Users/shawn/Documents/Code/android/MyFirstApp/res/layout/main.xml
Created directory /Users/shawn/Documents/Code/android/MyFirstApp/res/drawable-xhdpi
Created directory /Users/shawn/Documents/Code/android/MyFirstApp/res/drawable-hdpi
Created directory /Users/shawn/Documents/Code/android/MyFirstApp/res/drawable-mdpi
Created directory /Users/shawn/Documents/Code/android/MyFirstApp/res/drawable-ldpi
Added file /Users/shawn/Documents/Code/android/MyFirstApp/AndroidManifest.xml
Added file /Users/shawn/Documents/Code/android/MyFirstApp/build.xml
Added file /Users/shawn/Documents/Code/android/MyFirstApp/proguard-project.txt

我试过了,这个command line有点坑爹,建好的项目只是过去的目录结构,并不是gradle的结构,也没有添加gradle打包相关配置,或许用eclipse可以打开运行,但是不推荐

Tip: Add the platform-tools/ as well as the tools/ directory to your PATH environment variable.
把这些命令添加到系统环境变量里会更方便哦~

经验尚欠,希望各位看官多加指正,或通过邮件联系我

[转载]Cmd Markdown 语法

(部分功能并不是markdown原生语法功能,所以未能实现效果)


我们理解您需要更便捷更高效的工具记录思想,整理笔记、知识,并将其中承载的价值传播给他人,Cmd Markdown 是我们给出的答案 —— 我们为记录思想和分享知识提供更专业的工具。 您可以使用 Cmd Markdown:

  • 整理知识,学习笔记
  • 发布日记,杂文,所见所想
  • 撰写发布技术文稿(代码支持)
  • 撰写发布学术论文(LaTeX 公式支持)

cmd-markdown-logo

除了您现在看到的这个 Cmd Markdown 在线版本,您还可以前往以下网址下载:

Windows/Mac/Linux 全平台客户端

请保留此份 Cmd Markdown 的欢迎稿兼使用说明,如需撰写新稿件,点击顶部工具栏右侧的 新文稿 或者使用快捷键 Ctrl+Alt+N


什么是 Markdown

Markdown 是一种方便记忆、书写的纯文本标记语言,用户可以使用这些标记符号以最小的输入代价生成极富表现力的文档:譬如您正在阅读的这份文档。它使用简单的符号标记不同的标题,分割不同的段落,粗体 或者 斜体 某些文字,更棒的是,它还可以

1. 制作一份待办事宜 Todo 列表

  • [ ] 支持以 PDF 格式导出文稿
  • [ ] 改进 Cmd 渲染算法,使用局部渲染技术提高渲染效率
  • [x] 新增 Todo 列表功能
  • [x] 修复 LaTex 公式渲染问题
  • [x] 新增 LaTex 公式编号功能

2. 书写一个质能守恒公式[^LaTeX]

$$E=mc^2$$

3. 高亮一段代码[^code]

1
2
3
4
5
6
7
@requires_authorization
class SomeClass:
pass

if __name__ == '__main__':
# A comment
print 'hello world'

4. 高效绘制 流程图

1
st=>start: Start
op=>operation: Your Operation
cond=>condition: Yes or No?
e=>end

st->op->cond
cond(yes)->e
cond(no)->op

5. 高效绘制 序列图

1
Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!

6. 绘制表格

项目 价格 数量
计算机 \$1600 5
手机 \$12 12
管线 \$1 234

7. 更详细语法说明

想要查看更详细的语法说明,可以参考我们准备的 Cmd Markdown 简明语法手册,进阶用户可以参考 Cmd Markdown 高阶语法手册 了解更多高级功能。

总而言之,不同于其它 所见即所得 的编辑器:你只需使用键盘专注于书写文本内容,就可以生成印刷级的排版格式,省却在键盘和工具栏之间来回切换,调整内容和格式的麻烦。Markdown 在流畅的书写和印刷级的阅读体验之间找到了平衡。 目前它已经成为世界上最大的技术分享网站 GitHub 和 技术问答网站 StackOverFlow 的御用书写格式。


什么是 Cmd Markdown

您可以使用很多工具书写 Markdown,但是 Cmd Markdown 是这个星球上我们已知的、最好的 Markdown 工具——没有之一 :)因为深信文字的力量,所以我们和你一样,对流畅书写,分享思想和知识,以及阅读体验有极致的追求,我们把对于这些诉求的回应整合在 Cmd Markdown,并且一次,两次,三次,乃至无数次地提升这个工具的体验,最终将它演化成一个 编辑/发布/阅读 Markdown 的在线平台——您可以在任何地方,任何系统/设备上管理这里的文字。

1. 实时同步预览

我们将 Cmd Markdown 的主界面一分为二,左边为编辑区,右边为预览区,在编辑区的操作会实时地渲染到预览区方便查看最终的版面效果,并且如果你在其中一个区拖动滚动条,我们有一个巧妙的算法把另一个区的滚动条同步到等价的位置,超酷!

2. 编辑工具栏

也许您还是一个 Markdown 语法的新手,在您完全熟悉它之前,我们在 编辑区 的顶部放置了一个如下图所示的工具栏,您可以使用鼠标在工具栏上调整格式,不过我们仍旧鼓励你使用键盘标记格式,提高书写的流畅度。

tool-editor

3. 编辑模式

完全心无旁骛的方式编辑文字:点击 编辑工具栏 最右测的拉伸按钮或者按下 Ctrl + M,将 Cmd Markdown 切换到独立的编辑模式,这是一个极度简洁的写作环境,所有可能会引起分心的元素都已经被挪除,超清爽!

4. 实时的云端文稿

为了保障数据安全,Cmd Markdown 会将您每一次击键的内容保存至云端,同时在 编辑工具栏 的最右侧提示 已保存 的字样。无需担心浏览器崩溃,机器掉电或者地震,海啸——在编辑的过程中随时关闭浏览器或者机器,下一次回到 Cmd Markdown 的时候继续写作。

5. 离线模式

在网络环境不稳定的情况下记录文字一样很安全!在您写作的时候,如果电脑突然失去网络连接,Cmd Markdown 会智能切换至离线模式,将您后续键入的文字保存在本地,直到网络恢复再将他们传送至云端,即使在网络恢复前关闭浏览器或者电脑,一样没有问题,等到下次开启 Cmd Markdown 的时候,她会提醒您将离线保存的文字传送至云端。简而言之,我们尽最大的努力保障您文字的安全。

6. 管理工具栏

为了便于管理您的文稿,在 预览区 的顶部放置了如下所示的 管理工具栏

tool-manager

通过管理工具栏可以:

发布:将当前的文稿生成固定链接,在网络上发布,分享
新建:开始撰写一篇新的文稿
删除:删除当前的文稿
导出:将当前的文稿转化为 Markdown 文本或者 Html 格式,并导出到本地
列表:所有新增和过往的文稿都可以在这里查看、操作
模式:切换 普通/Vim/Emacs 编辑模式

7. 阅读工具栏

tool-manager

通过 预览区 右上角的 阅读工具栏,可以查看当前文稿的目录并增强阅读体验。

工具栏上的五个图标依次为:

目录:快速导航当前文稿的目录结构以跳转到感兴趣的段落
视图:互换左边编辑区和右边预览区的位置
主题:内置了黑白两种模式的主题,试试 黑色主题,超炫!
阅读:心无旁骛的阅读模式提供超一流的阅读体验
全屏:简洁,简洁,再简洁,一个完全沉浸式的写作和阅读环境

8. 阅读模式

阅读工具栏 点击 或者按下 Ctrl+Alt+M 随即进入独立的阅读模式界面,我们在版面渲染上的每一个细节:字体,字号,行间距,前背景色都倾注了大量的时间,努力提升阅读的体验和品质。

9. 标签、分类和搜索

在编辑区任意行首位置输入以下格式的文字可以标签当前文档:

标签: 未分类

标签以后的文稿在【文件列表】(Ctrl+Alt+F)里会按照标签分类,用户可以同时使用键盘或者鼠标浏览查看,或者在【文件列表】的搜索文本框内搜索标题关键字过滤文稿,如下图所示:

file-list

10. 文稿发布和分享

在您使用 Cmd Markdown 记录,创作,整理,阅读文稿的同时,我们不仅希望它是一个有力的工具,更希望您的思想和知识通过这个平台,连同优质的阅读体验,将他们分享给有相同志趣的人,进而鼓励更多的人来到这里记录分享他们的思想和知识,尝试点击 (Ctrl+Alt+P) 发布这份文档给好友吧!


再一次感谢您花费时间阅读这份欢迎稿,点击 (Ctrl+Alt+N) 开始撰写新的文稿吧!祝您在这里记录、阅读、分享愉快!

作者 @ghosert
2015 年 06月 15日

[^LaTeX]: 支持 LaTeX 编辑显示支持,例如:$\sum_{i=1}^n a_i=0$, 访问 MathJax 参考更多使用方法。

[^code]: 代码高亮功能支持包括 Java, Python, JavaScript 在内的,四十一种主流编程语言。