SBTickerViewでFlipboard風のUIを実現する

FlipboardのUIは操作性、見た目ともにすごく好きです。

http://www.youtube.com/watch?v=YOQAGmXOERI

そんなUIをSBTrickerViewを使うと簡単に実現できます。

githubからcloneすると、デモプロジェクトが一緒になっているのでそれを参考にサンプルを作って見ました。

blommegard/SBTickerView – GitHub.

UIImageを使えば写真、SBTickViewというクラスを使えばテキストをパラパラと表示できます。
SBTickViewを参考に拡張すれば画像とテキストを重ねたものも作れるかもと思いました。

写真をパラパラめくるアプリ



サーバー設定変更メモ @ServersMan

不要なポートを閉じる

設定確認してたら、mysqlとsshのデフォルト22番ポートが解放されてたので閉じた。

netstatで確認してたらmysqlとssh(22)のポート開いてるorz.

[root@suusuke ~]# netstat -a
Active Internet connections (servers and established)
Proto Recv-Q Send-Q Local Address               Foreign Address             State      
tcp        0      0 *:mysql                      *:*                         LISTEN      
tcp        0      0 *:ssh                      *:*                         LISTEN

mysql

[root@suusuke ~]# vi /etc/my.cnf 

[mysqld]セクションに skip-networking を追加

[root@suusuke ~]# service mysqld restart
mysqld を停止中:                                           [  OK  ]
mysqld を起動中:                                           [  OK  ]

ssh(22)

[root@suusuke ~]# vi /etc/ssh/sshd_config 

portが２つ(デフォルト:22と別で設定したもの)が設定されてたので22をコメントアウト

[root@suusuke ~]# service sshd restart
sshd を停止中:                                             [  OK  ]
sshd を起動中:                                             [  OK  ]

netstatでmysqlとsshが表示されないことを確認！

Xcodeが最新なのにiOS5 SDKがインストールされてない

iOS5 SDKが無いせいで実機にビルド、転送する際にビルドできないとなってしまいました。
※プロジェクトの設定でBase SDKでiOS5(Lastest iOS)が選択できないため
SpotlightでXcodeを検索してInstall Xcodeを実行するとiOS5 SDKインストールできるとどこかのブログに書いてあったので実行したらインストールできました。

プロビジョニングファイル作成から実機転送手順

プロビジョニングファイルを作成し、iPhone実機でテストする際の手順。

開発マシンで証明書署名要求(CSR)作成

開発用証明書(Development/Developer Certificate)を生成するために使用される個人情報が含まれてる。
iOSプロビジョニングポータルにこの要求を提出し、開発用証明書を取得する。

  • [アプリケーション] -> [ユーティリティ] -> [キーチェーンアクセス]から、キーチェーンアクセスを起動。
  • キーチェーンアクセスのメニューの「環境設定」を起動。
  • 「一般・First Aid・証明書」とあるので、証明書をクリック。
  • 「オンライン証明書状況プロトコル（OCSP）」を「可能な場合に適用」
    「証明書執行リスト（CRL）を「可能な場合に適用」
    「優先順位」を「OCSP」に設定。
  • キーチェーンアクセスのメニューから　[証明書アシスタント] -> [認証局に証明書を要求]
    • ユーザーのメールアドレス：iOS Dev Centerに登録しているメールアドレス。
    • 通称：iOS Dev Centerに登録している名前。（iOS Dev Centerにログインして、右上に表示されている名前）
    • CAのメールアドレス：空白。
    • 要求の処理：ディスクに保存、鍵ペア情報を指定にチェック
  • 上記を設定して「続ける」ボタンクリック。
    • 鍵のサイズ：2048ビット
    • アルゴリズム：RSA
  • 上記に設定して「続ける」ボタンクリック。

証明書署名要求(CSR)の登録と開発用証明書の取得

  • ブラウザで、iOS Dev Centerにログインして、右側にある「iOS Provisioning Portal」にアクセス。
  • 左のメニューから「Certificates」にアクセス。
  • 一番最初であれば、 「Request Certificates」ボタンをクリック。
  • 画面下にファイル選択用のボタンをクリックして証明書署名要求ファイルを選択。
  • Submitボタンをクリック。
  • Certificatesの一覧ページになるので、しばらくして再読込すると「Download」ボタンが表示されるので、クリックして保存。
    その下の「If you do not have the WWDR intermediate certificate installed, click here to download now.」 のリンクのファイルを保存。

開発用証明書の登録

  • キーチェーンアクセスを開き、ダウンロードした、「developer_identity.cer」ファイルを　[ログイン] -> [自分の証明書]　のところへドラッグして登録する。
    もう一つダウンロードしたファイルの「AppleWWDRCA.cer」はダブルクリックして登録する。

プロビジョニングファイル登録・デバイス転送

  • Xcode4のオーガナイザを開き、転送する実機をUSBのケーブルで繋ぐ。
  • DEVICESの下に実機の名前が表示されたら、DEVICE名をクリックして、下にある「Add to Portal」をクリック。
    自動的にiOS Dev Centerに接続してiPhoneの登録をしてくれる。
  • iOS Dev Centerに戻り、左のメニューの「App IDs」をクリック。
    ※一度作成したAppIDは、削除出来ない。
  • 右上にある「New App ID」ボタンをクリック。

    • Discription：半角英数字で入力。アプリ名と同じだとわかりやすい。
    • Bundle Seed ID (App ID Prefix)：Generate New
    • Bundle Identifier (App ID Suffix)：ドメインを逆にしたもの＋アプリ名か、*にするとよい。
    • com.yourdomain.appname or com.yourdomain.*

    ここに設定したBundole IdentifierとXcodeのinfo.plistのBundle identifierは同じにする。

  • 設定したら「Submit」ボタンをクリック。
  • Xcode4に戻り、左のプロジェクト名をクリック。
  • Projectをクリックして、Build SettingsのCode Signing IdentityのDebugをTeam Provisioning Profileに変更する。Any iOS SDKも同じように変更。
  • TERGETSをクリックして、Build SettingsのCode Signing IdentityのDebugをTeam Provisioning Profileに変更する。Any iOS SDKも同じように変更。
  • iPhoneをUSBのケーブルでつなぎ、Schemeをクリックして、iPhoneの名前を選択して、Runをクリック。実機に転送される。

2台目以降のMacで開発する場合

複数のMacで開発する際の証明書 | iPhoneアプリ開発雑記帳.

iPhone Developer Program 登録

iPhone Developer Program に登録した際の備忘録です。

登録

  • iOS Developer Program – Apple Developer. から [今すぐ登録]から登録を行います。

  • [続ける]をクリック。

  • 既にApple Developerには登録済みだったので、既にアップルデベロッパとして登録済みの方のアップルデベロッパとして登録済みで、アップルデベロッパプログラムに登録を希望します。を選択後、[続ける]をクリック。
  • Are you enrolling as an individual or company? 個人用か？法人用か？と聞かれるので個人用(individual)の方[Individulal]をクリック。
  • 登録してあるApple IDで Sing in する。

  • 住所等入力して[Continue]をクリック。
    一応、ローマ字で入力。

  • iOS Developer Programを選択し、[Continue]をクリック。
  • 入力内容を確認して、[Continue]をクリック。
  • 規約を読み、同意したらチェックボックスにチェックして、[I Agree]をクリック。
  • [Add to cart]ボタンをクリック。
  • Apple Store に移動するので、ライセンスを購入する。
    購入手続きが完了すると購入完了のメールが届く。

認証(アクティベーション)

購入完了のメールの後に[ Apple Developer Program Activation Code ] と言うメールが届くので、メール内にあるアクティベーションのリンクをクリックする。
※私の場合は1h後くらいにメールが届いた。

しかし、We are unable to activate your Apple Developer Program membership.というエラーメッセージが表示されてしまって、アクティベーションに失敗する。

これはよくあることのようで、私もApple IDに登録している個人名を日本語で登録していたのでこのようになってしまったようだ。
この個人名はApple Developerページへ変更してもどうしても変更できない箇所であった。

サポートからメール送ってくださいと記載あるので、How to Contact Us – Apple Developer.から

Subject
iOS Developer Program Enrollment Status
Your region
Japan
Request Details
日本語でアクティベーションできない旨と、名前をローマ字表記に修正してくださいと記載(Enrollment IDも記載)

として、メールを送った。

翌日には、

Apple Developer Program のメンバーシップをご購入いただく場合、請求先情報と iOS Developer Program 登録情報を比較するシステムを使用しております。最近いただいたご購入の情報には、購入プロセスが完了せず、保留状態になっておりました。

確認させていただいたところ、保留状態を解除いたしました。お受け取りになった Activation Code メールを再度ご確認いただき、リンクをクリックしたいただくようお願いいたします。アカウントを認証出来るはずです。

というメールが届いていたので、再度アクティベーション行ったところ正常に認証されました。
また、個人名についてもローマ字表記に修正されていました。

ブラウザとOS別に適用するCSSのクラスを指定できるJSのご紹介

ひょんな事から、スマートフォンサイトのHTMLコーディングを最近しております。

スマートフォンサイトはバリバリHTML5が使えるので楽しいですね。

スマートフォンサイトのコーディングする際は、webkit系のブラウザかiOSシュミレーターのsafariである程度確認してから、実機で確認という流れで表示確認してたのですが、Windowsのsafariでもズレがないようにコーディングして下さいと上から申し出がありました。
※本当に対応する必要があったかは謎ですが。。。

Windowsのsafariでずれる原因はfontが”メイリオ”になってしまい、”ヒラギノ角ゴ”などと比べるとline-heightが高いので、水平に配置しても微妙にずれがでてしまってました。

他に影響が出ないようにと、工数が少ない中だった事もあり、今回はCSS Browser Selector.を使って、Windowsのsafariだった場合のスタイルを定義して対応しました。

これはホント便利ですね。

Mac に HTMLコーディング環境構築(Aptana)

目次

  • Aptanaインストール
  • Zen-Codingインストール
  • Vrapperインストール

Aptanaインストール

Aptana.からAptanaをダウンロード、インストールする。
※2011/11/16現在3.0.6

Zen-Codingインストール

プラグイン化された物があるので、Aptanaにhttp://zen-coding.ru/eclipse/updates/をアップデートサイトとして登録してインストールする。

Vrapperインストール

こちらもプラグインなので、Aptanaにhttp://vrapper.sourceforge.net/update-site/stableをアップデートサイトとして登録してインストールする。

設定ファイルは、ホームディレクトリに.vrapperrcという名前で作ります。
https://github.com/suusuke/dotfiles

Mac に Android 開発環境構築

Androidの開発環境が必要になったので備忘録。

目次

  • Android SDKインストール
  • Eclipseインストール
  • ADTプラグインのインストール
  • Eclipse設定

Android SDKインストール

Android SDK | Android Developers.からMac用のSDKをダウンロードし、/Developer/に配置します。

ちなみに、/Developer-3.2.6/というディレクトリが僕の環境にはありますが、これはXcode4をインストールしたときに古いXcodeが退避されたものです。
Xcode3の環境も必要だったので、残っててよかった。

次に、toolsにパスを通します。

[suusuke@macbook ~]$ vi ~/.bash_profile

PATH=$PATH:/Developer/android-sdk-macosx/tools/
export PATH

[suusuke@macbook ~]$ source ~/.bash_profile

Eclipseインストール

Android開発用にEclipseをインストールします。
Eclipse Downloads.からEclipse IDE for Java Developersの64 bit版をダウンロードしました。

解凍されたeclipseフォルダを/User/suusuke/java/の下に移動し、eclipse3.7.1-Androidにリネームしました。
この辺はお好みですがeclipseはいつも、/User/suusuke/java/の下で何用なのかわかりやすいようにリネームしています。

Workspaceは~/Android/にするので以下のようなスクリプトを書いてeclipseを実行させます。

vi start_eclipse3.7.1-Android.sh
#!/bin/bash

~/java/eclipse3.7.1-Android/eclipse -data ~/Android -vmargs -Xms512m -Xmx768m -XX:PermSize=32m -XX:MaxPermSize=256m &
exit

ADTプラグインのインストール

[Help]->[Install New Software]からhttps://dl-ssl.google.com/android/eclipse/を追加して、インストールします。

インストール後再起動します。

Eclipse設定

Eclipseの環境設定からAndroid SDKのパスを設定します。
SDK Location:に/Developer/android-sdk-macosx

Android SDK コンポーネントインストール

[Window]->[Android SDK Manager]からコンポーネントをインストールします。
Androidのバージョンは2.1〜4.0までインストールしました。

エミュレータの作成

[Window]->[AVD Manager]を選択します。

[New…]からエミュレータを作成します。

Name:
エミュレータの名前を指定します。[Version]_[解像度]のルールで名前を付けていくと良いようです。
Target:
ターゲットのOSを指定します。
SD Card:
エミュレータが使用するSDカードの容量を指定します。32MBくらいあれば十分。
Skin:
［Built-in:］は，エミュレータの画面解像度を設定します。

設定画完了したら[start…]からエミュレータを起動します。

後は言語を日本語に設定して完了です。

WordPress 高速化

目次

  • APC
  • WP Super Cache
  • MySQLクエリキャッシュ

APC

PHPの中間コードをキャッシュしてくれるもの。多分一番有名。

APC（Alternative PHP Cache）再び – Do You PHP?.

[root@suusuke ~]# yum --enablerepo=remi install php-pear ← 対象サーバにpearが入ってなかったので
[root@suusuke ~]# yum install gcc gcc-c++ ← 対象サーバにgccが入ってなかったので
[root@suusuke ~]# pecl install APC

WP Super Cache

WordPressのページをキャッシュしてくれるプラグイン。

WordPress › WP Super Cache « WordPress Plugins.

MySQLのクエリキャッシュ

MySQLのクエリをキャッシュするようにしてDBアクセスを減らす。
ブログの閲覧は殆どがSELECTなので有効。

MySQLでクエリキャッシュする方法.

mysql> set global query_cache_size=41984;
Query OK, 0 rows affected (0.24 sec)

mysql> show variables like 'query_cache_size';
+------------------+-------+
| Variable_name    | Value |
+------------------+-------+
| query_cache_size | 41984 |
+------------------+-------+
1 row in set (0.00 sec)

Windows で rsync を使用する

Windowsの場合、サーバとファイルをやり取りする際はWinSCP(ssh)が有名どころだと思いますが、開発環境サーバにソースファイルをアップするときにいちいち、WinSCPを立ち上げてアップするのは少々めんどくさい感じがします。

他には、sambaサーバを立てたり、sshfsでマウントしてアップする方法も有りますが、個人的には開発環境ではコマンド一つでサーバにアップしたいと思っています。

macには、rsyncコマンドがあります。

WindowsでもcwRsyncを使えば、rsyncコマンドを使う事が出来ます。

目次

  • 開発環境に公開鍵認証方式(ssh)の設定をする
  • cwRsyncインストール
  • cwRsyncコマンド実行

開発環境に公開鍵認証方式(ssh)の設定をする

cwRsyncコマンドでパスワード入力無しでコマンド１つで同期する為、公開鍵認証方式(パスフレーズ無し)の設定をします。

開発環境なので全てrootユーザで実行しています。

[root@localhost ~]# ssh-keygen -t rsa　←　公開鍵、秘密鍵の作成(パスフレーズ無し)
[root@localhost ~]# chmod 700 ~/.ssh　←　パーミッション設定
[root@localhost ~]# chmod 600 ~/.ssh/*

[root@localhost ~]# cat ~/.ssh/id_rsa.pub >> ~/.ssh/authorized_keys　←　公開鍵をリネームコピー

[root@localhost ~]# vi /etc/ssh/sshd_config　←　sshdの設定

RSAAuthentication yes　←　コメント解除
PubkeyAuthentication yes　←　コメント解除
AuthorizedKeysFile .ssh/authorized_keys　←　コメント解除

AllowUsers root　←　追加

[root@localhost ~]# service sshd restart　←　sshd再起動

秘密鍵「/root/.ssh/id_rsa」をWindowsにコピーしておく。

インストール

Download | ITeF!x. からcwRsyncをダウンロード、インストールします。

今回はC:\cwRsyncにインストールしました。
コピーしておいた秘密鍵「/root/.ssh/id_rsa」をC:\cwRsync\192.168.1.3に移動します。

cwrsync.cmdにコマンド例の記述があります。
このファイルに以下を記述して、実行すると開発環境にファイルが同期されます。

C:\cwRsync\bin\rsync.exe -rvz -e "C:\cwRsync\bin\ssh.exe -i /cygdrive/c/cwRsync/192.168.1.3/id_rsa" --block-size=81920 --stats --progress /cygdrive/c/home/sample/ root@192.168.1.3:/home/sample/

ただ、実行すると毎回「Are you sure you want to continue connecting (yes/no)?」と聞かれてしまうので~/.ssh/configに

host *
    StrictHostKeyChecking no

を追加して聞かれないようにしました。