【SyntaxHighlighter】ブログ記事中のコードを分かり易く表示する

ブログを書く際、コードや設定ファイルを記載する事があるが、本文と同様の書式で書いているので、イマイチ見栄えもしないし、読み難い。

他のブログ等ではカッコよく、分かり易く表示されているので、自分も見習ってみたいと思った。
ちょいと調べてみたところ、Syntax Highlighter というのを使うのが良さそうだ。

導入に当たってはこちらの記事（Blogger に Syntax Highlighter を導入する）を大いに参考にさせて頂いた。

一点、若干つまずいたところは、Bloggerのプレビュー画面では、表示が反映されないというところだ。

公開状態にすれば、問題なく表示されるようだ。

試しに、昨日ブログに掲載したコード（＋α）を再掲してみる。


[ボタンをタップする毎に、画面の数字を０から１つずつ増やしていくプログラム]

MainActivity.java

　　public class MainActivity extends ActionBarActivity {

    　　private static int i = 0;

    　　@Override
    　　protected void onCreate(Bundle savedInstanceState) {
        　　super.onCreate(savedInstanceState);
        　　setContentView(R.layout.activity_main);

        　　final TextView textView = (TextView) findViewById(R.id.textView);
        　　final Button button = (Button) findViewById(R.id.button);

        　　// ボタンをクリックした際の処理
        　　button.setOnClickListener(new View.OnClickListener() {
            　　@Override
            　　public void onClick(View v) {
                　　i++; // i を１増やす
                　　textView.setText(String.valueOf(i)); // i の値を表示する
            　　}
       　　 });
    　　}
　　}

activity_main.xml

　　<RelativeLayout 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:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="0"
        android:id="@+id/textView"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Plus Button"
        android:id="@+id/button"
        android:layout_below="@+id/textView"
        android:layout_centerHorizontal="true" />
　　</RelativeLayout>