Build beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code—that helps teams build high quality digital experiences.
class: chapter-1, hero, center, middle # <nobr>動かす</nobr> DevFest Kansai 2016 2016/11/27 荒木佑一 --- class: chapter-1, normal # 自己紹介 .card[ 荒木佑一 [@yuichi_araki](https://twitter.com/yuichi_araki) Developer Programs Engineer @Google - サポート ライブラリ (主に design と transition) - Google I/O アプリ - Google Santa Tracker アプリ - [d.android.com/samples](http://d.android.com/samples) のサンプルいろいろ - [CameraView](https://g
前回の記事では、TextInputLayoutとFloatingActionButtonについて書きました。 androhi.hatenablog.com 今回は、主にSnackbarとCoordinatorLayoutについて調べたことを、書いていきます。 SnackBar Android 4.4まではアプリ内で簡易的な通知を行う際に、Toastを使った実装が多かったと思いますが、Android 5.0以降はSnackbarと呼ばれる実装を使うよう推奨されてます。 UIとしてはToastととてもよく似ていますが、Snackbarにはアクションを含めることが出来る点や、スワイプ操作で表示を消すことが出来る点などが異なっています。 詳細は、公式サイトのSnackbars&toastsが詳しいです。 Snackbarの表示 使い方はほぼToastと同じなので、以下のようなコードで表示させてみま
概要 Google Playのようにスクロールした時にToolbar部分を隠す単純な方法です。 SupportLibraryのみを使って実装できます。 余計な実装は極力省いていますのでActivityのみで実装してます。 注意 先に注意事項を。 これをLollipop未満のバージョンで実現するにはスクロールするコンテンツ部分に制限があります。 RecyclerViewまたはNestedScrollViewが必要になります。例えば普通のListViewではLollipop未満では実現できませんので注意です。(Lollipop以降でListViewでの実装は後述します) 実行イメージ 実装手順 gradle build.gradleは次のようになります。 dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) compi
はじめに マテリアルデザインという言葉は知っていましたが、それが一体なんなのかを正しく理解しないまま、 「これからは、マテリアルデザインだぜ」のような顔して、生活していましたが、 知ったかぶりしているのがバレる前に、少し学んでおこうと思いました。 マテリアルデザインとは 2014年にGoogleが発表した「デザインのガイドライン」。 直訳すると「物質デザイン」。 マテリアルデザインの目的 スマートフォン、タブレット、テレビ、メガネ、腕時計などのデバイスで、 統一されたデザインを取り入れることにより、操作性も統一され デバイスが変わっても使いやすいUIを実現できるとか。 現実世界のルール(奥行きや、影など、質量)を取り入れることで、直感的な操作を実現します。 マテリアルデザイン誕生までの歴史 1.スキューモフィズムでのデザイン スキューモフィズムとは スキューモーフィズム(skeuomorp
この記事では、マテリアルデザイン初心者の自分が良いなと思うサイトをご紹介します。 上から順に見ていくと理解が深まるのではないのかなと思います。 マテリアルデザインとは? よくわかるマテリアルデザインの設計コンセプト よくわかるマテリアルデザインの設計コンセプト | fladdict マテリアルデザインの設計コンセプトが分かりやすく書かれている良記事です。 これをまず読んでみてコンセプトを掴んでおけば、理解が深まると思います。 マテリアルデザインとフラットデザインって結局何が違うの? Googleマテリアルデザインとフラットデザインって結局何が違うの?[UI/UX] | naver フラットデザインなら知っているよっていう人はこちらを見ると良いかもしれません。 動画で見てみる マテリアルデザインを解説してくれてます。 日本語字幕が出ているので親切です。 ちなみにGoogleのデザイン関連の動
github.com いつもの compile 'com.android.support:design:23.0.1' compile 'konifar:fab-transformation:1.0.0' activity_main.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.design.widget.Floating
概要 Floating Action Button(以降fab)を使ったspeeddialを実装したので、その方法をまとめておく こんな感じの 詳細 layout レイアウトでは展開するfabを重ねておく 初期表示で表示しないものはvisible:goneにしておく <RelativeLayout 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" tools:context="suum
現在は新しいアプリを開発中です。 そこでマテリアルデザインのボタンを使いたいと思い、どのように実装すればいいのか調べて分かったので書きます。 方法としては、テーマにマテリアルデザインのものを指定してあげるとできるみたいです。 実際に実装した例を載せます。 今回は2種類のボタンを作成しました。 1つ目がオレンジ色のボタン 2つ目が白色のボタン です。 【実装方法】 ①styles.xmlにボタン用のスタイルを作成します。 ここではAccentButtonStyleとNegativeButtonStyleの2種類です。 parentにマテリアルデザインの「Theme.AppCompat」か「Theme.AppCompat.Light」を指定します。 違いは、文字を黒ベースか白ベースにするかになります。 また、以下のitemに好きな色を指定します。 colorButtonNormal :ボタンの
.app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #DevFest23 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads
.app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #DevFest23 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads
こんにちは。エンジニアの細谷です。 以前にも当エンジニアブログの「Android版マネーフォワードをマテリアルデザイン対応したときのあれこれ」で紹介しましたが、マネーフォワードのAndroidアプリのUIはマテリアルデザインを積極採用しています。 マテリアルデザインを採用した開発を効率的に進める上で欠かせないのがAndroidのサポートライブラリです。 v22.2(2015年5月公開)で追加になったデザインサポートライブラリの一部は実際にマネーフォワードのAndroidアプリにも導入していますので、その中でも特に簡単に導入できる3つのコンポーネントを紹介します。 また、発表されて間もないv23(2015年8月公開)についても、未導入ながら今後の展望として紹介します。 ※ Support Libraryの更新状況等はこちらなどで確認できます。 Support Library v22.2 v2
皆さん、こんにちは。Androidエンジニアの後藤です。 前回のブログで次回はAndroid MやDeveloperToolについて書きます!!と熱くなっていましたが、Design Support Library ( DSL ) の魅力をどうしてもお伝えしたくなったので、今回はDSLについて書いていきます! これを機に、ライブラリが提供しているコンポーネントを使ってTODOアプリを作ってみたので、コードを見ながら一緒にDSLをマスターしていきましょう!! もうコードを見たくて仕方が無い方はどうぞ! https://github.com/eure/citrus Databaseには話題のRealmを使ってみています。 理由は、実はですね……… ……なんとなくです。 今回はデザインからコードまでを自分でやりました。DSLを使うことが目標なので、マテリアルデザインのルールは厳守していません。 D
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く