dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])

    compile 'com.android.support:appcompat-v7:23.4.0'
    compile 'com.android.support:design:23.4.0'
    compile 'com.android.support.constraint:constraint-layout:1.0.0-alpha3'
}

下記のコードを試す上で基本となるレイアウトなどのソースコード

Android Studioに用意されているNavigation Drawer Activityのプロジェクトのものをほとんどそのまま利用しています。

一応見たいという方はこちらよりご確認ください。

HeaderViewのレイアウトを変更する

NavigationView.removeHeaderView(View view)とNavigationView.addHeaderView(View view)を使えば特に難しいことを考えずサクッと入れ替えられました。

        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // HeaderViewを変更できるテストとしてHeaderViewが1個以上あれば
                // HeaderViewを消すテスト
                if(navigationView.getHeaderCount() >= 1) {
                    navigationView.removeHeaderView(navigationView.getHeaderView(0));
                } else {
                    navigationView.inflateHeaderView(R.layout.nav_header_main);
                }
            }
        });

f:id:woshidan:20160907222153g:plain

サイドメニューの項目を変更する場合

一部の項目の表示/非表示にする場合。

    boolean isMenuGroup1Visible = true;


        FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // 一部のmenuの項目の表示/非表示を切り替えるテスト
                navigationView.getMenu().setGroupVisible(R.id.menu_group_1, !isMenuGroup1Visible);
                isMenuGroup1Visible = !isMenuGroup1Visible;
            }
        });

f:id:woshidan:20160907223531g:plain

サイドメニューの項目をがらっと変えたい場合。

        FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // サイドメニューの項目をmenuリソースから生成し直す場合
                navigationView.getMenu().clear();
                navigationView.inflateMenu(R.menu.test);
            }
        });

<!-- test.xml -->
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/nav_gallery"
        android:icon="@drawable/ic_menu_gallery"
        android:title="Gallery" />
    <item
        android:id="@+id/nav_slideshow"
        android:icon="@drawable/ic_menu_slideshow"
        android:title="Slideshow" />
    <item
        android:id="@+id/nav_manage"
        android:icon="@drawable/ic_menu_manage"
        android:title="Tools" />
</menu>

f:id:woshidan:20160907224022g:plain

サイドメニューの項目にバッジをつけたい場合

stackoverflow.com

menuリソースのitem要素の属性に、バッジの元となるWidgetのクラスとしてTextViewを指定して...とありましたが、この方法だと、どうも追加した要素の高さをうまく調整できなかったので、MenuItemCompat.setActionView(MenuItem menuItem, int layoutRes)メソッドで、バッジ用に用意したレイアウトを与えて、そのレイアウトを変更してやる方がいじりやすそうでした。

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/nav_gallery"
        android:icon="@drawable/ic_menu_gallery"
        android:title="Gallery" />
    <item
        android:id="@+id/nav_slideshow"
        android:icon="@drawable/ic_menu_slideshow"
        android:title="Slideshow" />
    <item
        android:id="@+id/nav_manage"
        android:icon="@drawable/ic_menu_manage"
        android:title="Tools" />
</menu>

<!-- nav_menu_badge.xml  -->
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:gravity="center"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:textColor="@android:color/white"
        android:id="@+id/badge_text"
        android:background="@color/colorAccent"
        android:padding="4dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

        MenuItem galleryItem = MenuItemCompat.setActionView(navigationView.getMenu().findItem(R.id.nav_gallery), R.layout.nav_menu_badge);
        TextView badgeText = (TextView) galleryItem.getActionView().findViewById(R.id.badge_text);
        badgeText.setText("99");

        FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // バッジを消したり、内容を変更したりするテスト
                LinearLayout galleryBadge = (LinearLayout) MenuItemCompat.getActionView(navigationView.getMenu().findItem(R.id.nav_gallery));
                TextView badgeText = (TextView) galleryBadge.findViewById(R.id.badge_text);

                if(badgeText.getText() == "99+") {
                    MenuItemCompat.setActionView(navigationView.getMenu().findItem(R.id.nav_gallery), null);
                } else {
                    badgeText.setText("99+");
                }

            }
        });

f:id:woshidan:20160908001443g:plain

下に固定のfooterをつけたい場合

NavigationViewの中にandroid:layout_gravity="bottom"の指定をつけて要素を追加したらよさそうでした。

<!-- activity_main.xml -->
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <include
        layout="@layout/app_bar_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer" >

        <TextView
            android:text="Footerのテスト"
            android:gravity="center"
            android:layout_gravity="bottom"
            android:background="@color/colorAccent"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
            this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
        drawer.setDrawerListener(toggle);
        toggle.syncState();
    }

f:id:woshidan:20160908075544p:plain

追加したFooterとかぶった部分についてスクロールさせたいときはどうするかについては、対処が若干微妙で、アイコン透明なものを用意した選択不可能なメニューをその部分に追加するのが自分が探した中で綺麗な方の解決方法でした....^^;

2016-09-07

Mac OSにmecabをインストールしてnattoを利用してrubyからmecabを叩いてみる

ruby mecab

ちょっとある程度の量の短文から単語の出現頻度を抽出する必要があり、さわったのでメモ。

Mac OSにHomebrewでmecabをインストールする

Homebrewを通して入れます*1。

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

$ brew install mecab
$ brew install mecab-ipadic

mecabをrubyから叩きやすいようにnattoのgemを入れる

割と薄い感じのラッパーっぽいやつです。mecab-rubyでもよさそう。

参考:

$ gem install natto

ユーザー辞書を作る

普通の辞書だけだとインターネット業界の人間にとっては、単語が足りないので*2、はてなキーワードからユーザー辞書を作ってみます。

手順としては、

ユーザー辞書の元となるデータの取得
ユーザー辞書の元となるデータをCSVにする
CSVをユーザー辞書ファイルとしてコンパイルする
ユーザー辞書ファイルをmecabの設定ファイルに追加する

となります。

参考:

ユーザー辞書の元となるデータの取得

curl -L http://d.hatena.ne.jp/images/keyword/keywordlist_furigana.csv | iconv -f euc-jp -t utf-8 > keywordlist_furigana.csv

ユーザー辞書の元となるデータをCSVにする

表層形,左文脈ID,右文脈ID,コスト,品詞,品詞細分類1,品詞細分類2,品詞細分類3,活用形,活用型,原形,読み,発音という行が並んだCSVを作っていきます。

例: 工藤,1223,1223,6058,名詞,固有名詞,人名,名,*,*,くどう,クドウ,クドウ

# http://qiita.com/ynakayama/items/388c82cbe14c65827769 の引用に近いですが...
require 'csv'

CSV.open("custom.csv", 'w') do |csv|
  original_data.each do |type, filename|
    next unless File.file? filename
    open('keywordlist_furigana.csv').each do |title|
      title.strip!

      next if title =~ %r(^[+-.$()?*/&%!"'_,]+)
      next if title =~ /^[-.0-9]+$/
      next if title =~ /曖昧さ回避/
      next if title =~ /_\(/
      next if title =~ /^PJ:/
      next if title =~ /の登場人物/
      next if title =~ /一覧/

      title_length = title.length

      if title_length > 3
        score = [-36000.0, -400 * (title_length ** 1.5)].max.to_i
        csv << [title, nil, nil, score, '名詞', '一般', '*', '*', '*', '*', title, '*', '*', type]
      end
    end
  end
end

CSVをユーザー辞書ファイルとしてコンパイルする

環境によって若干パスが違うので、注意。

/usr/local/Cellar/mecab/0.996/libexec/mecab/mecab-dict-index -d /usr/local/Cellar/mecab-ipadic/2.7.0-20070801/lib/mecab/dic/ipadic -u custom.dic -f utf-8 -t utf-8 custom.csv

ユーザー辞書ファイルをmecabの設定ファイルに追加する

nattoのドキュメント見てもユーザー辞書をその場で登録する感じの説明が見当たらなかったのでmecabの設定ファイルにユーザー辞書のパスを追加します。

#  /usr/local/etc/mecabrc に下記の行を追加
userdic = /Users/woshidan/path/to/custom.dic

nattoを使ってmeacbを叩いてみる

require 'natto'

irb(main):001:0> require 'natto'
=> true
irb(main):002:0> nm = Natto::MeCab.new
=> #<Natto::MeCab:0x007fd4431c0948 @model=#<FFI::Pointer address=0x007fd4442c90e0>, @tagger=#<FFI::Pointer address=0x007fd444300e10>, @lattice=#<FFI::Pointer address=0x007fd444300ea0>, @libpath="/usr/local/Cellar/mecab/0.996/lib/libmecab.dylib", @options={}, @dicts=[#<Natto::DictionaryInfo:0x007fd4431f3cf8 @filepath="/usr/local/lib/mecab/dic/ipadic/sys.dic", charset=utf8, type=0>], @version=0.996>
irb(main):003:0> nm.parse("はじめてのMecab")
=> "はじめて\t副詞,一般,*,*,*,*,はじめて,ハジメテ,ハジメテ\nの\t助詞,連体化,*,*,*,*,の,ノ,ノ\nMecab\t名詞,固有名詞,組織,*,*,*,*\nEOS\n"
irb(main):004:0> puts nm.parse("はじめてのMecab")
はじめて  副詞,一般,*,*,*,*,はじめて,ハジメテ,ハジメテ
の 助詞,連体化,*,*,*,*,の,ノ,ノ
Mecab 名詞,固有名詞,組織,*,*,*,*
EOS
=> nil

natto, あるいは、mecab-rubyについて、出力形式は他にも良さげなオプションがあった気がしますが、ひとまずこういう感じで。

*1:Yosemite以上にバージョンアップしていたので、自宅のPCのbrewが壊れており http://qiita.com/sue738/items/7ab03ecc9f6fcf37408d http://qiita.com/riocampos/items/b27952faa24524e2919f http://himenaotaro.hatenablog.com/entry/2016/02/14/105251の記事にお世話になりました

*2:プリキュアとか刀剣乱舞とかいろいろ

2016-09-06

Google App Scriptでセルを扱う

Google App Script

はてなが俺たちのはてなじゃない...。

諸々の集計業務を担当することになって、コピペを効率化しようと思ってGoogle App Scriptを調べたのでまとめます。

内容

特定のセルの値を取得
特定のセルに値を貼り付け
他のファイルのソースコードを参照するときの手順
確認用ダイアローグを出す
シートを開いたときに行う処理
参考

特定のセルの値を取得

// 単一の値を取得
SpreadsheetApp.getActive().getSheetByName("SHEET_NAME").getRange("A1").getValue();

// 現在アクティブなシートを取得する場合
SpreadsheetApp.getActiveSpreadsheet()).getRange("A1").getValue();

// 特定の範囲の中の値を取得する場合
// 2次元配列が帰ってきます
SpreadsheetApp.getActive().getSheetByName("SHEET_NAME").getRange("A1:B6").getValues();

特定のセルに値を貼り付け

// 単一のセルに貼り付けというのはなく、範囲から範囲への貼り付けとなる
var rangeToCopy = sheet.getRange('A:A');
var targetToCopy = sheet.getRange('B1'); // 貼り付け範囲か、一番左上のセルを指定するようにしておく
rangeToCopy.copyTo(targetToCopy);

// 形式のみ, 値のみのオプションについて
rangeToCopy.copyTo(targetToCopy, {formatOnly:true}); // 形式のみ
rangeToCopy.copyTo(targetToCopy, {contentsOnly:true}); // 値のみ

// 2次元配列を特定の範囲へ貼り付け
var copyValues = [[1, 2], [3, 4]];
SpreadsheetApp.getActive().getSheetByName("SHEET_NAME").getRange("A1:B2").setValues(copyValues);

他のファイルのソースコードを参照するときの手順

新しいプロジェクトを作成して分割したいソースコードを貼る
1のプロジェクトに対して、 ファイル > 版で管理 から、他のプロジェクトに公開するバージョンのコメントを入れて保存
2のプロジェクトのソースコードを参照したいプロジェクトを開いて、リソース > ライブラリ を選択
3で開いたメニューの下の方に、2のプロジェクトのURLの一部 https://script.google.com/macros/d/SomeLooooongRandomString/edit?ui...の SomeLooooongRandomStringの部分を入れる
入力した文字列が正しければ、2のプロジェクト名が3のメニューに現れるので、2のプロジェクトを利用する側で使うバージョンと、2のプロジェクトの関数などの前につく識別子を入力して、「保存」を押す
2のプロジェクトを利用する側で、5で決めた識別子を頭につけて2のプロジェクト内の関数を利用する

確認用ダイアローグを出す

// メッセージだけでる
Browser.msgBox("メッセージが出ます");

// OK/キャンセルのボタンがついたダイアローグが出る
Browser.msgBox("これからシートを編集しますか?", Browser.Buttons.OK_CANCEL);

// 選択されたボタンを取得
var selections = Browser.msgBox("これからシートを編集しますか?", 
                        Browser.Buttons.OK_CANCEL);
// キャンセルボタンをクリックした場合は"cancel"
Browser.msgBox(selections);

シートを開いたときに行う処理

// シートを開いたときにダイアローグを出す
function onOpen(){
  Browser.msgBox("これからシートを編集しますか?", Browser.Buttons.OK_CANCEL);
}

// シートを開いたときに上部にメニューを追加する
function onOpen() {
  var sheet = SpreadsheetApp.getActiveSpreadsheet();
  var entries = [
    {
      name : "シートの上部にに追加するメニュー内の項目の名前",
      functionName : "その項目を選択したとき起動する関数"
    }
  ];
  sheet.addMenu("シートの上部に追加するメニューの名前", entries);
}

参考

結局なのですが、普通にGoogle Spread Sheetの関数を使ってCSVインポートからのコピペ前の整形作業用の単純なシートを何枚か作ったらそれだけで大幅に時間が短縮されてしまい、Google App Scriptの動作が遅かったため、2日程度で0からほとんど動くところまで書いたのに導入までできなかったのが残念です...。

暇なときにもう少し手直ししてリベンジしたい...。

2016-08-09

Spinnerのレイアウトをコードで変更する

Android Spinner

スタイルを利用した指定がうまく動かなかったり見つけるまでにちょっと時間がかかったりしたので、まあ適当にメモ。

android:id="@android:id/text1"と@android:id/text1がidに指定されたTextViewだけのレイアウトリソースを用意
Spinnerの要素をセットする ArrayAdapter の引数に渡す
ドロップダウン用のレイアウトは、ArrayAdapter.setDropDownViewResourceメソッドの引数に渡す

Adapterに手動で要素を追加しているのは、利用する時にスピナーの要素が動的に変わっていたからです。

また、Spinnerの要素の先頭に画像などをセットしたい場合は、BaseAdapterを継承してgetViewメソッドをオーバーライドして用います。

setContentView(R.layout.activity_main);

ArrayAdapter<String> adapter = new ArrayAdapter(this, R.layout.item_in_list);
adapter.add("One");
adapter.add("Two");
adapter.add("Three");
adapter.setDropDownViewResource(R.layout.item_in_drop_down_list);
AppCompatSpinner spinner = (AppCompatSpinner) findViewById(R.id.imageFolderNameSpinner);
spinner.setAdapter(adapter);

spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
    @Override
    public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
    }

    @Override
    public void onNothingSelected(AdapterView<?> parent) {

    }
});

<!-- res/layout/activity_main.xml -->
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="com.example.woshidan.myapplication.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay">
            <android.support.v7.widget.AppCompatSpinner
                android:id="@+id/imageFolderNameSpinner"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                />
        </android.support.v7.widget.Toolbar>

    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_main"/>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:src="@android:drawable/ic_dialog_email" />

</android.support.design.widget.CoordinatorLayout>

<!-- item_in_list.xml -->
<?xml version="1.0" encoding="utf-8"?>
<TextView android:id="@android:id/text1"
    android:textSize="18dp"
    android:padding="8dp"
    android:textColor="#0f0"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:ellipsize="marquee"
    android:background="#fff"
    android:textAlignment="inherit"
    xmlns:android="http://schemas.android.com/apk/res/android" />

<!-- item_in_drop_down_list.xml -->
<?xml version="1.0" encoding="utf-8"?>
<TextView android:id="@android:id/text1"
    android:textSize="18dp"
    android:padding="8dp"
    android:textColor="#f00"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:ellipsize="marquee"
    android:textAlignment="inherit"
    xmlns:android="http://schemas.android.com/apk/res/android" />

f:id:woshidan:20160809000455g:plain

スタイルで指定できるはずなんだけどなぁ。

2016-08-04

SSL/TSLについて少し勉強しました

SSL/TSL セキュリティサーバー

内容

SSL/TSLで使うプロトコルの設定について
SSL証明書のインストールの大まかな流れ
プロトコルのバージョンと利用出来る公開鍵証明書のハッシュ関数について

SSL/TSLで使うプロトコルの設定について

SSL/TSLの利用はApacheやnginxなどのWebサーバのソフトの設定を通して有効にできます。また、これらのソフトが動くサーバのOSのバージョンによっては一部のプロトコルが利用できない場合があります。

SSL/TSLの暗号化のアルゴリズムの指定は暗号スイートの単位で行います。

暗号スイートというのは、通信の暗号化に使うアルゴリズムはこれ、鍵交換に使うアルゴリズムはこれ、といった風に通信の各部の暗号化プロトコルの組み合わせのことです。

// Apacheの場合
SSLCipherSuite DHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES128-SHA256:DHE-RSA-CAMELLIA128-SHA:DHE-RSA-AES128-SHA:AES128-GCM-SHA256:AES128-SHA256:CAMELLIA128-SHA:AES128-SHA:DHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES256-SHA256:DHE-RSA-CAMELLIA256-SHA:DHE-RSA-AES256-SHA:AES256-GCM-SHA384:AES256-SHA256:CAMELLIA256-SHA:AES256-SHA

// nginxの場合
ssl_ciphers AES128-SHA:AES256-SHA:RC4-SHA:DES-CBC3-SHA:RC4-MD5;

openssl ciphersで、そのコンピュータに入っているopensslが利用出来る暗号スイートの一覧が見れます。

d.hatena.ne.jp

$ openssl ciphers -v
DHE-RSA-AES256-SHA      SSLv3 Kx=DH       Au=RSA  Enc=AES(256)  Mac=SHA1
DHE-DSS-AES256-SHA      SSLv3 Kx=DH       Au=DSS  Enc=AES(256)  Mac=SHA1
AES256-SHA              SSLv3 Kx=RSA      Au=RSA  Enc=AES(256)  Mac=SHA1
EDH-RSA-DES-CBC3-SHA    SSLv3 Kx=DH       Au=RSA  Enc=3DES(168) Mac=SHA1
EDH-DSS-DES-CBC3-SHA    SSLv3 Kx=DH       Au=DSS  Enc=3DES(168) Mac=SHA1
DES-CBC3-SHA            SSLv3 Kx=RSA      Au=RSA  Enc=3DES(168) Mac=SHA1
DES-CBC3-MD5            SSLv2 Kx=RSA      Au=RSA  Enc=3DES(168) Mac=MD5 
DHE-RSA-AES128-SHA      SSLv3 Kx=DH       Au=RSA  Enc=AES(128)  Mac=SHA1
DHE-DSS-AES128-SHA      SSLv3 Kx=DH       Au=DSS  Enc=AES(128)  Mac=SHA1
AES128-SHA              SSLv3 Kx=RSA      Au=RSA  Enc=AES(128)  Mac=SHA1
DHE-RSA-SEED-SHA        SSLv3 Kx=DH       Au=RSA  Enc=SEED(128) Mac=SHA1
DHE-DSS-SEED-SHA        SSLv3 Kx=DH       Au=DSS  Enc=SEED(128) Mac=SHA1
SEED-SHA                SSLv3 Kx=RSA      Au=RSA  Enc=SEED(128) Mac=SHA1
RC2-CBC-MD5             SSLv2 Kx=RSA      Au=RSA  Enc=RC2(128)  Mac=MD5 
RC4-SHA                 SSLv3 Kx=RSA      Au=RSA  Enc=RC4(128)  Mac=SHA1
RC4-MD5                 SSLv3 Kx=RSA      Au=RSA  Enc=RC4(128)  Mac=MD5 
RC4-MD5                 SSLv2 Kx=RSA      Au=RSA  Enc=RC4(128)  Mac=MD5 
EDH-RSA-DES-CBC-SHA     SSLv3 Kx=DH       Au=RSA  Enc=DES(56)   Mac=SHA1
EDH-DSS-DES-CBC-SHA     SSLv3 Kx=DH       Au=DSS  Enc=DES(56)   Mac=SHA1
DES-CBC-SHA             SSLv3 Kx=RSA      Au=RSA  Enc=DES(56)   Mac=SHA1
DES-CBC-MD5             SSLv2 Kx=RSA      Au=RSA  Enc=DES(56)   Mac=MD5 
EXP-EDH-RSA-DES-CBC-SHA SSLv3 Kx=DH(512)  Au=RSA  Enc=DES(40)   Mac=SHA1 export
EXP-EDH-DSS-DES-CBC-SHA SSLv3 Kx=DH(512)  Au=DSS  Enc=DES(40)   Mac=SHA1 export
EXP-DES-CBC-SHA         SSLv3 Kx=RSA(512) Au=RSA  Enc=DES(40)   Mac=SHA1 export
EXP-RC2-CBC-MD5         SSLv3 Kx=RSA(512) Au=RSA  Enc=RC2(40)   Mac=MD5  export
EXP-RC2-CBC-MD5         SSLv2 Kx=RSA(512) Au=RSA  Enc=RC2(40)   Mac=MD5  export
EXP-RC4-MD5             SSLv3 Kx=RSA(512) Au=RSA  Enc=RC4(40)   Mac=MD5  export
EXP-RC4-MD5             SSLv2 Kx=RSA(512) Au=RSA  Enc=RC4(40)   Mac=MD5  export

上記の一覧の一行分の内容の意味は、

暗号スイートの名前    プロトコルのバージョン    鍵交換の方法(KeyeXchange)    サーバ認証の方法(Authentication)    暗号化の方法(Encryption)    HMAC(Message Authentication Code)のハッシュアルゴリズム

となります。

理解してるつもりの SSL/TLS でも、もっと理解したら面白かった話 · けんごのお屋敷

SSL証明書のインストールの大まかな流れ

SSL/TSLを有効にするには、サーバの身元を保証するSSL証明書をサーバにインストールする必要があります。

https://www.cybertrust.ne.jp/sureserver/support/tec_download.html#01

上記の資料を参考におおまかな手順をまとめると、下記のようになります。

openssl genrsaコマンドで秘密鍵ファイルを作成 cf. openssl genrsa -aes256 -out server.key 2048
- 秘密鍵作成の際に入力したパスフレーズは公開鍵作成の時にも入力します
openssl reqコマンドで秘密鍵ファイルからCSR(公開鍵)ファイルを作成 cf. openssl req -new -key server.key -out server.csr
- SSL証明書の詳細情報を見たら出てくる情報を入力していきます
- 証明書を入れるサーバーのFQDNも入れます
- ここのコマンドで証明書の作成に使うハッシュ関数がSHA1かSHA2か指定します
  - SHA2のCSRを作成するコマンド cf. openssl req -new -sha256 -key www.example.com.key -out www.example.com.sha-2.csr
  - 参考: http://knowledge.sakura.ad.jp/tech/2766/
作成した公開鍵を証明書を発行する会社に送ります
証明書がサーバ証明書の会社から発行されます
- 中間CA証明書とサーバー証明書があります
サーバー証明書と中間証明書を連結させてpemファイルを作ってサーバーにアップロードします
- cf. cat サーバー証明書中間証明書 > 連結ファイル.pem
サーバーにアップロードした連結ファイルの場所をssl_certificate(nginxの場合)のディレクティブにフルパスで指定します
秘密鍵ファイルもサーバーにアップロードして、その場所をssl_certificate_key(nginxの場合)のディレクティブにフルパスで指定します
webサーバ(nginxなど)の再起動をして、SSLで通信できているか確認します

プロトコルのバージョンと利用出来る公開鍵証明書のハッシュ関数について

接続したいサービスごとにこのハッシュ関数で作った証明書でないとだめですよ、とか、このバージョンのプロトコルを使ってはダメですよ、といった設定がされていることがあります。

また、OSやブラウザの設定により、公開証明書のハッシュ関数が古いと正式な証明書でも不正な証明書と表示されたり、URLバーに警告が表示されることがあります。

postd.cc

今なら少し自信を持ってオレオレ証明書が作れそうな気がしてきました...

2016-08-03

UI用のクラスのプロトコルとWebViewなどについて

iOSお遍路 iPhone iOS UIView

内容

iPhone/iPadプログラミングバイブル iOS9/Xcode7/Swift 対応 (smart phone programming bible)

作者: 布留川英一
出版社/メーカー: ソシム
発売日: 2015/10/27
メディア: 単行本
この商品を含むブログ (1件) を見る

上の本を参考にiOSのUIViewと戯れています。

とりあえず、4章までやったので、ここまでで一区切り~~。

UI用のクラスを使うとき実装するプロトコルについて
- DataSource
- Delegate
WebViewの使い方について
ATSの例外のためのInfo.plistの設定
PlayGround
TableView
- リサイズマスク
- 行のIndicatorの種類
NavigationController
UIPickerViewを使う時に実装するプロトコルについて

UI用のクラスを使うとき実装するプロトコルについて

TableViewやWebView, PickerViewなどのクラスをViewControllerのViewに置く場合、対応するプロトコルを実装する必要があり、クラス名DataSource, クラス名Delegateといった名前をしています。

データの表示の中身やViewから受け取れるイベントのハンドリングをそれを置くViewのViewControllerに委譲する、みたいなのりみたいです。

DataSource

Viewのクラスで扱う行数や行ごとのViewを返すメソッドなどがあるみたいです。 AndroidでいうとAdapterにあたる感じのプロトコルです。

Delegate

Viewをタップした時などのイベントをハンドリングするメソッドを書くプロところです。 AndroidでいうとSwipeRefreshLayoutのコールバックのリスナーみたいな位置付けみたいです。

WebViewの使い方について

ViewController内でWebViewを生成するなり、StoryBoard上に配置した後ViewControllerとひも付けたり*1する
WebViewが置いてあるViewのViewControllerでUIWebViewDelegateプロトコルを実装
- カスタマイズが必要なら下記のメソッドなどをオーバーライドする
  - webView(webView: UIWebView, shouldStartLoadWithRequest: NSURLRequest, navigationType: UIWebViewNavigationType) -> Bool
    - https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIWebViewDelegate_Protocol/#//apple_ref/occ/intfm/UIWebViewDelegate/webView:shouldStartLoadWithRequest:navigationType:
    - 与えられたURLのコンテンツの読み込みを開始しようとした時に呼び出される
    - navigationTypeはフォームの投稿やリンクを踏んだなどの遷移の種類を意味する
    - 戻り値がfalseならコンテンツの読み込みを開始しない
  - webViewDidStartLoad(webView: UIWebView)
    - https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIWebViewDelegate_Protocol/#//apple_ref/occ/intfm/UIWebViewDelegate/webViewDidStartLoad:
    - コンテンツの読み込みが終わった後に呼び出される
  - webView(webView: UIWebView, didFailLoadWithError error: NSError?)
    - https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIWebViewDelegate_Protocol/#//apple_ref/occ/intfm/UIWebViewDelegate/webViewDidFinishLoad:
    - 読み込みが失敗した時に呼び出される
読み込みたいURLのリクエストを作成する
- let url: NSURL = NSURL(string: "ロード先")
- let urlRequest: NSURLRequest = NSURLRequest(URL: url)
WebViewでリクエストを読み込む WebView.loadRequest(urlRequest)

読み込み中のIndicatorを出したい場合は

UIApplication.sharedApplication().networkActivityIndicatorVisible = true

のようにする。

ATSの例外のためのInfo.plistの設定

結局 PropertyList からの編集がうまくいかなくて、ソースコードの編集をしました。

<plist version="1.0">
<dict>
  <key>NSAppTransportSecurity</key>
  <dict>
    <key>NSExceptionDomains</key>
    <dict>
            <key>localhost</key><!-- HTTPでの通信を例外的に許可したい「ドメイン名」を入れる -->
            <!-- ダメな例: http://localhost:3000 -->
            <!-- ダメな例: localhost:3000 -->
            <!-- ダメな例: 192.168.56.1 -->
            <!-- ダメな例: 192.168.56.1:3000 -->
            <dict>
                <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
                <true/>
            </dict>
    </dict>
  </dict>

PlayGround

アプリ全体のビルドをせずにViewや関数だけを試したりできるSwiftの実行環境です。

ViewをPlayGroundで表示して試したい時は、

import UIKit
import XCPlayground

class CustomView: UIView {
  // Viewの実装
}

val testView = CustomView()
XCPShowView("Some ID", testView)

のように、XCPShowViewメソッドを使います... と書いてあったのですが、 Swift 2.1の頃に XCPlaygroundPage を使うように変わり、XCPShowViewメソッドはdeprectedになっていました。

参考: http://qiita.com/koishi/items/e78f8b852d5f7ae8d125

実際使っている様子は下記です。

f:id:woshidan:20160802233426p:plain

TableView

リサイズマスク

これは実はInterfaceBuilderでやるのでは、と思ったのですが、一応設定をメモします。

        let tableView = UITableView()
        tableView.frame = frame
        tableView.autoresizingMask = [
            UIViewAutoresizing.FlexibleWidth,
            UIViewAutoresizing.FlexibleHeight,
            UIViewAutoresizing.FlexibleBottomMargin,
            UIViewAutoresizing.FlexibleLeftMargin,
            UIViewAutoresizing.FlexibleRightMargin,
            UIViewAutoresizing.FlexibleTopMargin
        ]

行のIndicatorの種類

// cellはUITableViewCellのインスタンス
cell.accessoryType = UITableViewCellAccessoryType.None // 何もつけない
cell.accessoryType = UITableViewCellAccessoryType.DisclosureIndicator // そのセルの右側に「 > 」みたいなのをつける
cell.accessoryType = UITableViewCellAccessoryType.DetailDisclosureButton // そのセルの右側に「(i) > 」みたいなのをつける
cell.accessoryType = UITableViewCellAccessoryType.Checkmark // そのセルの右側にチェックマークをつける. Noneと切り替え?して使う?

NavigationController

NavigationControllerを使いたいViewControllerはStoryBoardでNavigationControllerを追加
NavigationControllerの戻るボタンに入る文字はひとつ前のスタックのViewControllerのタイトル

UIPickerViewを使う時に実装するプロトコルについて

UIPickerViewは要素が輪のようになっていてクルクル回して選択するUIです。

UIPickerView - UIKit | Apple Developer Documentation

UIPickerViewDelegateについて
- func pickerView(pickerView: UIPickerView, rowHeightForComponent component: Int) -> CGFloat で1行の高さ
- func pickerView(pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusingView view: UIView?) -> UIView で1行分のViewを作成
- func pickerView(pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) でピッカーの要素が
UIPickerViewDataSourceについて
- func pickerView(pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int で、行数を返すメソッドを返す
- func numberOfComponentsInPickerView(pickerView: UIPickerView) -> Int で、コンポーネント数を返すが基本は1でよさそうです

*1:参考: http://qiita.com/yuinchirn/items/59d54d318cce48772df0