Android Studio Release Notes | Android Studio
という訳で、某社で10月の中旬頃からお仕事させていただいたいるのですが、 新規のアプリ開発をさせていただいております。
その時点では、AndroidStudio3はまだベータ版だったのですが、 新しいバージョンのGradleが使いたいということでAndroid Studio beta7で開発を始めてました。
そのかいあってか、バージョンをあげても問題なくビルドできました！
リリースまで時間がなく、ベータ版での開発に少々の不安がありましたが、 リリース前に安定版が出てよかったです。
遅ればせながら、グリッドレイアウトの存在に気づいてしまいました。
今お仕事で作っているWebアプリの構成が下の図の通りなのですが。
この、レイアウトだとメニューとコンテンツのところがちょっと面倒ですよね。
html
<div> <div class="menu"></div> <div class="contents"></div> </div>
.menu {
display: inline-block;
}
.contents {
display: inline-block;
}
今まではこうやって凌いでました。 が、メニューのところの背景に色をつけたいとクライアント様から言われちゃいまして、 どうしたもんかと悩んでおりました。
<div>だとheightに%が使えず中の要素の大きさになってしまうので、
いい感じに背景色がつけられなかったのです。
そこで、グリッドレイアウトです。
html
<div class="grid">
<header></header>
<div class="menu"></div>
<div class="contents"></div>
<footer></footer>
</div>
こいつをいい感じにレイアウトします。
まずは、外枠に
.grid {
display: grid;
}
をつけます。 で、分割方法を指定します。
.grid {
display: grid;
grid-template-rows: 90px 1fr 40px;
grid-template-columns: 200px 1fr;
}
縦方向に３分割、横方向に２分割しました。
あとはどこへ配置するかを指定します。
header {
grid-row-start: 1;
grid-row-end: 2;
grid-column: 1 / -1;
background-color: #cccccc;
}
.menu {
grid-row-start: 2;
grid-row-end: 3;
grid-column-start: 1;
grid-column-end: 2;
background-color: #ff0000;
}
.content {
grid-row: 2 / -2;
grid-column: 2 / -1;
background-color: #eeeeee;
}
footer {
grid-column: 1 / -1;
grid-row: 3 / -1;
background-color: #666666;
}
こんな感じ。 分割したgridは左から1,2,3とナンバリングされていきます。 右からだと-1,-2,-3とナンバリングされるようです。 上下も同様。
入れたいエリアのナンバーを指定するとそこに配置されるようになります。
ご覧の通り。 ちょっと要素入れてみました。
メニューとコンテンツの高さはどちらかの大きい方に合わせてくれるようなので、 これでメニューのところにいい感じに背景色をつけることができました。
めでたしめでたし。
japan-android-group.connpass.com
本日はこちらのカンファレンスへ行ってきました。
私が聞いたセッションは以下です。
・Google AR101（TangoからARCore、WebAR）
・はじめてのActions on Google
・はじめてのAndroid Things入門
・あれから2年、オープンソースによるドローン開発はここまで来た！
この辺の技術は凄く興味あるのですが、
日本では技適が通ってないデバイスばかりでやりづらそうという印象。
GoogleHomeが思いの外盛り上がってるみたいなので、
GoogleAsistant上で動作するアプリとか作ってみると面白そうですね。
お仕事させていただいているお客様先で、
社内の勉強会がありまして、順番でスピーカーにならねばならないのですが、
そちらでちょっとお話させていただく機会を与えられたのですが、
何を話していいのやらネタがなくて、
とりあえず最近気になっているReactNativeについて発表してみました。
「ReactNativeに入門しました」というタイトルで発表してきました。
勉強会の３日前に慌てて環境を作り、簡単なコンポーネントを作成し、
３日でできた内容について資料をまとめて、話してきました。
環境を作るのはmacならとても簡単でした。
ほぼこれ通り。
ただ、AndroidはSDKにパスを通していてもエミュレータにインストールができなかったので、AndroidStudioで作ったプロジェクトからまま拝借したlocal.propatiesファイルを使いました。
作ったもの
まだちょっとしか触っていないので良くわかっていないのですが、
CSSはReactNativeが用意しているものしか使えないのでしょうか。
エラーになって使えないものがあったのですが、
何かやり方があるんでしょうか。
ちょっと良くわからないので、今後も引き続き勉強していこうと思います。
今、個人的に作っているアプリでRealmを使っているのですが、
データがちゃんと入っているか確認したいですよね。
そんな時にお役に立つのが、
Stethoです。
Stethoはアタッチしている端末の情報をブラウザで見ることができるライブラリです。
んで、Realmのデータを見る為には、
これ！
Stetho-Realmを使うといいです。
使い方は簡単。
あ、古いRealmだと使えないので、Realm2.1.0にしました。
dependencies {
compile'com.facebook.stetho:stetho:1.4.1'
compile 'com.uphyca:stetho_realm:2.0.0'
}
これいれる、Syncする。
古いrealmを使ったアプリが入っている場合には、一度アンインストールする必要があります。
apkをinstall！
で、Chromeブラウザを開きます。
developer consoleを開きます。
右上のメニューから「Remote Device」を選択すると新しいタブがどこかにでますので、そこから接続中の端末（エミュレータ）を選択して「insept」ボタンを押します。
すると新しい画面が立ち上がります。
ちょっと見ずらいですが、こんな画面がでますので、
左の「Web SQL」→自分の作ったrealmファイル→テーブル名
でデータを見ることができます。
便利！
これでデータ確認の為にログ入れたりする必要がなくなりますね。
先週はこちらのshibuya.apkへ行ってきました。
会場はyahooさんの新オフィスですね。
凄く綺麗で楽しげなオフィスでした。
お酒に軽食も出ましたしね！
大変おいしゅうございました。
ごちそうさまです。
さて、肝心の勉強会の内容なのですが、
1、AppShortCut
こちらは、7.1に新しく搭載された機能です。
yahooブラウザアプリにも実装したらしいのですが、
そもそもAndroidの7.1系を使っている人が3500人くらい。
AppShortCutが実際に使われているのが平気5/月回くらいらしいのです。
まだまだ、7系ユーザーが少ないので、使われる頻度は今の所少なそうということでした。
2、AndroidStudio2.3
まだまだ動作不安定のもよう。
UI Editorのパレットがカテゴリ分けされるようになるらしいです。
これは、確かに探すの面倒なんですが、カテゴリを覚えている訳ではないので、結局全部開いて探しちゃいそうです。
それと、Vector画像を文字検索できるようになるらしい。
それからそれから、WebP画像が作れるようになるとか。
その他にも機能盛りだくさんのようです。
3、Fiebase Remoto Config
Fierbaseにこんな機能があったんですね。
これから作るアプリはFirebaseを使うのが一般的になってくると思うので、
Firebaseだけで色々できるのは便利ですね。
４、anko
JetBrainsが作ってるレイアウトをコードで書こうっていう趣旨の技術ですね。
良い所はxmlのレビューをしなくていいところ。
悪いところはDataBindingが使えない、CustomViewを沢山作ろうとすると色々面倒って言ってたと思います。
５、ReactNative
のテストの話。
今テストを書こうとすると辛いってお話だったと。
そもそもまだReactNative自体が怪しい感じなので、
まだお仕事でReactNativeを採用するのは早いのではないかと。
６、android things
これはとても面白かったです。
ラズベリーパイにandroid thingsを入れて遊んでみたってお話。
残念ながらラズパイとプロジェクターの相性が悪くて、
動いている画面は見ることはできなかったのですが。
今週はandroid thingsの勉強会へ行くので楽しみです。
７、マテリアルデザイン
マテリアルデザインを歌っているわりには公式のsupport Liblaryが使いづらいし、下手したらバグっているってお話。
libraryのprivateメソッドを強引にいじってなんとか実現しましたというお話でした。
なんやかんやで、公式よりサードパーティのライブラリ使っちゃいますよね。
８、Backend for Frontend
これは、サーバーの構成をどうするかというお話。
おそらく殆どのプロジェクトがAPIはWeb、Android、iOSで共有て使っているんだろうけど、１つのサーバーから更に、Web用、iOS用、Android用と分けて、そこからフロントに向けてデータを飛ばすとフロント側で無駄なデータを受信しなくてよくなるってことらしい。
しかし、当然ながらバックエンド開発の工数が増えるっていうデメリットもあります。
９、Image Keyboard
support libraryで古いOSでもキーボードが簡単に作れるというお話だったかと。
ちょっとこれは楽しげですね。
やってみたい。
そんな感じだったと思います。
大変面白くて有意義でした。
しかし、こちらの勉強会は大人気で抽選なんですよね。
また行きたい。
今日はこちらの勉強会へ行ってきました。
React.jsは書いたことがないので、どういうものかさっぱりなのですが、
angular2を書いたことがあるのでなんとなく雰囲気はつかめました。
書き方は似ていますね。
javascriptは嫌いじゃないですが、セミコロンがちょっとうざい感じですよね。
angular2だと公式がTypeScriptやDartで書いてjsにコンバートする仕組みを作ってくれているのでjavascriptを直接かかなくてもいいのですが、Reactにはそういうのないんでしょうかね。
ここのところお仕事でもセミコロンのない言語を使っているので、なんとかセミコロンとはさよならしたい。
ちゃんと調べてないのですが、Kotlinでもこんなことができそうなので、
もしかしたらKotlinで書いてjavascriptを吐き出してReact NativeでiOSアプリを作るとかできるかもですね。
