2017-09-28

HHKB20周年記念ユーザミートアップに行ってきた

f:id:ryu955:20170928120115j:plain

HHKB20周年記念ユーザミートアップに行ってきました。

私がHHKBを使い始めたのは今年の5月くらいからでした。

それ以前はRealforceを使っていたのですが、研究室にあったHHKBを使っているうちに欲しくなってしまい買い替えました。

会場の入場時に記念品としてTシャツをいただきました。

f:id:ryu955:20170928120727j:plain

これともう一つ「馬の鞍」とプリントされたものもありました。

発表

発表は2部構成になっていて前半は今までの歴史、後半はこれからになっていました。

どんなことが話されたかはアーカイブが残っているので見てみると面白いと思います。

展示

会場の後ろ側には1995年に和田先生がPFUに持ち込んだ紙で作られたHHKBのプロトタイプから最新のBluetoothのものまで、歴代のHHKBが展示されていました。

f:id:ryu955:20170928120417j:plain

その中には10周年記念で作成された50万円する漆塗りのHHKBがあり、触ってみるとキーのストロークが普通のものよりも重く押しやすかったです。

社会人になってる30周年でまた再販されたら買ってしまうかもしれないです…

LTと懇親会

LTはHHKBミートアップという尖ったイベントなだけあった、色々濃くどれもおもしろかったです。

懇親会で中央の机に参加者の様々なキーボードが置かれ、その中にHHKBにトラックポイントを取り付けた物がありました。

このキーボードの作成ブログを以前読んでいたので実物をみれて感動しました。

f:id:ryu955:20170928120942j:plain

余談

お昼に食べた京都勝牛が美味しかったです。

f:id:ryu955:20170928120051j:plain

2017-09-06

ActionSheetPickerを使って時間を選択する

Swift プラグイン

はじめに

時刻表のアプリとかでよく見る，選択したらActionSheetとPickerが混ざったやようなやつが開いて時間を選べるやつを実装したかった

f:id:ryu955:20170906033132j:plain

使ったやつ

ActionSheetPicker-3.0

名前の通りActionSheetとPickerが組み合わさったものが使えるプラグイン

探し求めてたものがピンポイントでありました

環境

macOS Sierra 10.12.2
Xcode 8.3.1
Swift3
Carthage 0.25.0

ActionSheetPicker-3.0のインポート

ActionSheetPickerはライブラリ管理ツールを用いてインポートします．

今回はライブラリ管理ツールにCarthageを用いますが，CocoaPodsでもできます．

Carthageのインポートはreadmeに全て書いてあります．

Carthage自体の使い方はこの記事が丁寧で分かりやすかったので，ここをみつつInputFile名を $(SRCROOT)/Carthage/Build/iOS/CoreActionSheetPicker.framework に置き換えれば使ったことない人でも問題ないと思います．

こんな感じ f:id:ryu955:20170906040407p:plain

storyboard

まず，Main.storyboardにラベルとボタンを置きます． f:id:ryu955:20170906040751p:plain

その後，スクリプトにそれぞれを紐付けます．ボタンはConnectionをActionにします．

f:id:ryu955:20170906041436p:plain

ソースコード

storyboardに置いたボタンに動作を記述します．

gist.github.com

実行結果

f:id:ryu955:20170906051323g:plain

解説

9行目の datePickerMode の値を変更するとPickerの選択肢が変わる
- UIDatePickerMode.date だと下の図みたいに日付だけとか
- UIDatePickerMode. でいろいろサジェストされるから用途に合ったものを選択するといいと思います

f:id:ryu955:20170906051913p:plain

13行目のフォーマットを書き換えることで任意の表示方法にできる
22行目の数字の値の感覚で分が表示される

github

リポジトリ

cloneした後，ディレクトリ内でCarthageをビルドしないとエラーが出ると思うので，ターミナルでcloneしたディレクトリの中で carthage update --platform iOS を実行

2017-09-03

golang.tokyo #8 に行ってきた

勉強会

はじめに

golang.tokyo #8に行ってきました
- golang.tokyo #8 - connpass
ちなみにGo自体はA Tour of Goをやって，スクレイピングをやったくらいしか触ったことないです
開催場所のDMM.comの中は森でした

セッション

一人目

一人目の登壇者の星一さんはGoで作成した2Dゲームライブラリebitenについて発表されていました
- 発表資料
- ebitenとは
普段Unityでゲーム開発をしてるから，こういったゲームエンジンがどういう風に作られているかという話が面白かった
とりあえず，ebitenのwikiにあったTutorialsをやってみました
何かしらのGoの学習ついでになにかゲームをつくって見ようと思います

二人目

二人目の登壇者はzcheeさんは個人でつくっているGoのプロダクトについて発表されていました
- 発表資料

個人で作っているgoのプロダクト by zchee編 from Koichi Shiraishi

自分が不満を持ったことは自分で解決させるというのは大切なことだと思いました

感想

Go自体の知識はほぼない状態でしたが，Goにかぎらず様々なことに通じるセクションだったため面白かったです

2017-08-25

xamlで宣言したImageをスクリプトから動かす

WPF

はじめに

最近WPFを触ってるけど全く分からない
とりあえず機能単位のサンプルソースを自分で作ると理解した気になれた

やりたかったこと

xamlで宣言したの画像の位置をスクリプトから動的に変えたかった

やったこと

3通りの方法をやった

データバインディングを用いて
Canvasを用いて
DynamicResorceを用いて

結果

1は失敗
- 最初の読み込み時は想定の場所に行くけど、以降動かない
2は最低限のことはできたけど、Canvasのレイヤーの上でやる影響で色々厄介
3がいい感じだった

どんなコードかいたのか

画像をスクリプトで宣言した場所に動かすソースコード達
- 1はMainWindow()で行ってるけど，2と3は関数をつくった

データバインディングを用いて

<Grid>
    <Label x:Name="target" Content="動くよ" Margin="{Binding position}" VerticalAlignment="Top" RenderTransformOrigin="0.349,-0.072" Height="50" Width="50"/>
</Grid>

public MainWindow(){
  InitializeComponent();
    // Thicknessは構造体だからこんな感じでいれる
    // 引数はフィールドに宣言か，直でいれるとその場所に表示される
  Thickness margin = new Thickness(left, top, right, bottom);
  this.DataContext = new { position = margin};
}

そもそもデータバインディングをざっくりいうとxaml内の{Binding 変数名}に，スクリプトのプロパティの値をいれる見たいなものだと思う
- 詳しくはここ - ＠IT](http://www.atmarkit.co.jp/ait/articles/1010/08/news123.html))
起動時は想定の場所に行ってくれる
- 起動以降は座標を弄れなかった…
失敗

Canvasを用いて

<Grid Height="350" Width="525">
  <Canvas Height="350" Width="525">
     <Label x:Name="target" Content="動くよ" VerticalAlignment="Top" RenderTransformOrigin="0.349,-0.072" Height="50" Width="50" Canvas.Top="0" Canvas.Left="0"/>
</Grid>

// 引数にtopとleftをとって，その座標に移動する
private void MoveText(double top, double left) {
    Canvas.SetTop(target, top);
    Canvas.SetLeft(target, left);
}

Canvas.SetTop(変数名,top)でxamlで宣言されたCanvasタグに囲まれたオブジェクトをtopに移動
- leftも同様
引数の場所に移動出来たし，関数だからスクリプト内でループさせて移動させることができた
ただ，座標の比率が謎でpixelなげると変な挙動する
一応動いたけど没

DynamicResorceを用いて

<Grid>
    <Label x:Name="target" Content="動くよ" Margin="{DynamicResource position}" VerticalAlignment="Top" RenderTransformOrigin="0.349,-0.072" Height="50" Width="50"/>
</Grid>

private void MoveText(double left,double top,double right,double bottom) {
    Thickness margin = new Thickness(left, top, right, bottom);
    this.Resources["textMargin"] = margin;
}

DynamicResourceはリソースの内容が変更されたら対象のプロパティも変更される
ただ，移動させるのにmarginを使ってるから，比率を変えないようにするのがめんどくさい
ちなみに，StaticResourceにすると一度しか値が適用されなくて，データバインディングを使った時みたいになった
これで行くことにした

DynamicResorceのデモつくった

猫の画像が左から右に流れるつづけるだけのアプリケーション

解説

Update()の実装

 public MainWindow() {
     InitializeComponent();
     FixedTimeProcess();
 }

/// <summary>
/// 一定時間でDispatcherTimerTickを実行する関数
/// </summary>
private void FixedTimeProcess() {
    // 初期化
    dispatcherTimer = new DispatcherTimer(DispatcherPriority.Normal);
    // 左から　日数、時間、分、秒、ミリ秒で設定
    // 1ミリ秒ごとに30回実行
    dispatcherTimer.Interval = new TimeSpan(0, 0, 0, 0, 10);
    dispatcherTimer.Tick += new EventHandler(DispatcherTimerTick);
    dispatcherTimer.Start();
}

/// <summary>
/// FixedTimeProcessで実行される関数
/// </summary>
private void DispatcherTimerTick(object sender, EventArgs e) {
  // 一定時間毎に処理したい内容をここに記述
}

UnityのUpdate()見たいな関数を作りたかった

猫の画像を動かす

private void DispatcherTimerTick(object sender, EventArgs e) {

    catleft = (catleft < windowWidth / 2) ? catleft + 1 : -40;
    catright = (catleft < windowWidth / 2) ? catright - 1 : 240;

    MovePic(catleft, 84, catright, 84, "catMargin");
}

/// <summary>
/// テキストの大きさを変える関数
/// </summary>
private void MovePic(double left, double top, double right, double bottom, string target) {
    Thickness margin = new Thickness(left, top, right, bottom);
    this.Resources[target] = margin;
}

今回は左から右に動かすだけだから，marginのtopとbottomは定数とした
marginのleftをインクリメントして，rightをデクリメントさせることで移動する
- この時，画像本体の横幅が一定になるようにする
画面の端に行ったらleftとrightを初期値に戻す
MovePic()は最初の4つの引数でmarginを設定する
- 最後のstring型の引数で移動させたいtargetの名前をいれる

2017-03-22

VR Tech Tokyo#6に行ってきた

勉強会

f:id:krkrkgr:20170322171841j:plain

（終了しました）VR Tech Tokyo #6 @ Microsoft - connpass

connpassで面白そうな勉強会ないか探してたら面白そうなイベントを見つけたので行ってきた

VR，AR，MRに興味合ったし，バイトでARに関係する開発やってるから惹かれた．

Windows Mixed Realityについての発表だったり，VRゲームのゲームデザインについての発表だったりと様々な内容があって面白かった．

個人的に一番すごいなって思ったのがVoxelKeiさんの「日本列島VRとHoleLenz」の中にあったHoleLenz Gateだった．

ヒェッ…HoloLensアプリ「HoleLenz Gate」が高所恐怖症をかき立てる｜ギズモード・ジャパン

もともとSFとかが好きなので近未来感があって面白いなって思った．

発表も面白かったけど体験会で，VR音ゲーのAIR TONEを体験したりホロレンズを初めて触ったりと楽しかった．

#7も行けたら行きたい

2017-03-01

【Unity】ボタンの画像を動的に変える

Unity

やりたかったこと

uGUIのボタンの画像をスクリプトから動的に変えたかった。
ゲームオブジェクトは複数にしたくなかった。
- ゲームオブジェクトを複数用意してSetActive()で出す方法も考えたがそれをやると内部を大分いじる必要が出る為没　　　　- というか、力技すぎてソースがめっちゃ汚くなる

模索

SpriteRenderer

最初にSpriteRendererを用いる方法を思いついた。

using UnityEngine;
using System.Collections;

public class changeImage : MonoBehaviour {
    // 画像を動的に変えたいボタンの宣言
    SpriteRenderer btnSpriteRenderer;

    // inspectorで直接画像のスプライトを張り付ける
    public Sprite Asprite;
    public Sprite Bsprite;
    public Sprite Csprite;

    void Start(){
        // SpriteRendererを所得する
        btnSpriteRenderer = this.GetComponent<SpriteRenderer>();
    }

    void Update(){
        // フラグによってそれに合った画像に差し替える
        if (flg == "a"){
            btnSpriteRenderer.sprite = Asprite;
        }else if(flg == "b"){
            btnSpriteRenderer.sprite = Bsprite;
        }else if(flg == "c"){
            btnSpriteRenderer.sprite = Csprite;
        }
    }
}

動かなかった。
どうやらuGUIのボタンの画像はSpriteRendererでは変えられず、Imageを用いないといけないらしい

Image

using UnityEngine;
using System.Collections;
// Imageを使うためにインポート。忘れずに
using UnityEngine.UI;

public class changeImage : MonoBehaviour {
    // 画像を動的に変えたいボタンの宣言
    SpriteRenderer btnImage;

    // inspectorで直接画像のスプライトを張り付ける
    public Sprite Asprite;
    public Sprite Bsprite;
    public Sprite Csprite;

    void Start(){
        // Imageを所得
        btnImage = this.GetComponent<Image>();
    }

    void Update(){
        // フラグによってそれに合った画像に差し替える
        if (flg == "a"){
            btnImage.sprite = Asprite;
        }else if(flg == "b"){
            btnImage.sprite = Bsprite;
        }else if(flg == "c"){
            btnImage.sprite = Csprite;
        }
    }
}

無事動いた

まとめ

uGUIの画像をスクリプトから動的に変える場合はSpriteRendererではなくImageを使う

2017-02-17

【Unity】androidでビルドできなかった話

Unity

問題

Unityで作ったやつをiOSでビルドして正しい動きができるの確認できたから，androidでも確認しようとしたらこんなこと言われてビルドが出来なかった．

f:id:krkrkgr:20170217004445p:plain

Unable to install APK!
Installation failed.See the Console for details.

原因

ビルド端末にビルドしようとしたプロジェクトと同じBundle Identifierのアプリが合ったため．

私が詰まった理由は，ビルド端末にビルドしようとしたプロジェクトと同じアプリケーションはなかったものの，名前は違うがBundle Identifierがビルドしようとしたプロジェクトと同じものが合ったせいで原因を見つけるのに時間がかかった．

解決方法

解決方法は2つ考えられると思う

ビルド端末に内にある，現在ビルドしようとしているプロジェクトに設定されているBundle Identifierと同じアプリを消す
Bundle Identifierを変える

多分1が無難

Bundle Identifierの確認方法

Build SettingのPlayer Settingsを押す

f:id:krkrkgr:20170217005936p:plain

発表

展示

LTと懇親会

余談

はじめに

使ったやつ

環境

ActionSheetPicker-3.0のインポート

storyboard

実行結果

解説

はじめに

セッション

一人目

二人目

感想

はじめに

やりたかったこと

やったこと

3通りの方法をやった

結果

どんなコードかいたのか

データバインディングを用いて

Canvasを用いて

DynamicResorceを用いて

DynamicResorceのデモつくった

解説

Update()の実装

猫の画像を動かす

やりたかったこと

模索

SpriteRenderer

Image

まとめ

問題

原因

解決方法

Bundle Identifierの確認方法

Build SettingのPlayer Settingsを押す

Inspector内のOther Settingsの下の方にBundle Identifierがある