がんばらないデザインシステム - MOL
TLDR: Material Designをカスタマイズして利用した話 最近、デザインシステムって言葉よく聞きますよね。airbnbではDLSというデザインシステムを持っていたり、UberはBase Webというデザインシステムを持っていたり、アメリカ連邦政府も持ってたりします。国内のIT企業でもデザインシステムを作成しているとの事例もよく耳にします。 デザインシステムとは？ デザインシステム：デザインの基準やドキュメント、原則に加えて、基準を達成するためのUIパターンやコンポーネントなどのツールキットをすべて備えたもの。 デザインシステムの定義と作成方法、導入事例 | UX MILK では、デザインシステムってのはどういったもんなんでしょうか？これまでも、スタイルガイドやコンポーネントライブラリといったものは聞いたことがありますが、デザインシステムというのはそれらも含めたもう少し大きなモ
ViewPager + TabLayout + NavigationView + CoordinatorLayout - Qiita
よーく使うやつです。よーく見るやつです。もう新しくアプリ作るってなったらとりあえずこれの準備から。 ViewPager + Tablayout + DrawerLayout(NavigationView) + CoordinatorLayout + AppBarLayout 早速行きましょう！！！ あ、Githubにコード上げてあるのでもういいから見せろという人はどうぞ。 DesignSupportLibraryを まずはGoogle様本社の方角に向かって礼をしながら依存関係を記しましょう。 def supportLibraryVersion = '24.1.1' compile "com.android.support:design:$supportLibraryVersion" バージョンを適宜変更してください。 ちなみにDesignSupportLibraryに関しましては解説とか特
Raised Button の作り方（持ち上げ型ボタン） - Android開発についてのメモ
現在は新しいアプリを開発中です。 そこでマテリアルデザインのボタンを使いたいと思い、どのように実装すればいいのか調べて分かったので書きます。 方法としては、テーマにマテリアルデザインのものを指定してあげるとできるみたいです。 実際に実装した例を載せます。 今回は２種類のボタンを作成しました。 １つ目がオレンジ色のボタン ２つ目が白色のボタン です。 【実装方法】 ①styles.xmlにボタン用のスタイルを作成します。 ここではAccentButtonStyleとNegativeButtonStyleの２種類です。 parentにマテリアルデザインの「Theme.AppCompat」か「Theme.AppCompat.Light」を指定します。 違いは、文字を黒ベースか白ベースにするかになります。 また、以下のitemに好きな色を指定します。 colorButtonNormal ：ボタンの
マテリアルデザインについて少し調べる - Qiita
はじめに マテリアルデザインという言葉は知っていましたが、それが一体なんなのかを正しく理解しないまま、 「これからは、マテリアルデザインだぜ」のような顔して、生活していましたが、 知ったかぶりしているのがバレる前に、少し学んでおこうと思いました。 マテリアルデザインとは 2014年にGoogleが発表した「デザインのガイドライン」。 直訳すると「物質デザイン」。 マテリアルデザインの目的 スマートフォン、タブレット、テレビ、メガネ、腕時計などのデバイスで、 統一されたデザインを取り入れることにより、操作性も統一され デバイスが変わっても使いやすいUIを実現できるとか。 現実世界のルール(奥行きや、影など、質量)を取り入れることで、直感的な操作を実現します。 マテリアルデザイン誕生までの歴史 1.スキューモフィズムでのデザイン スキューモフィズムとは スキューモーフィズム（skeuomorp
Tool Bar (Action Bar) に icon, logo, up indicator などを表示する - Qiita
Tool Bar (Action Bar) に icon, logo, up indicator などを表示するAndroidActionBartoolbarUpIndicatorUpNavigation "Basic Activity"を使って新規にプロジェクトを作成した後、"Tool Bar"上にiconやup indicator などを表示する方法のメモです。 環境 "Windows 10 Pro (64bit)" 上の "Android Studio 2.2"で確認しています。 Android Studio Android Studio 2.2.1 Build #AI-145,3330264, built on October 6, 2016 JRE: 1.8.0_76-release-b03 amd64 JVM: OpenJDK 64-Bit Server VM by JetBr
EditTextの色変更箇所まとめ - Qiita
コード レイアウトxmlのEditTextはこんな感じです。AppCompatEditTextを使っていますが、EditTextでも同じです。 style と app:theme を両方指定しているのは、 style だけだと colorControlNormal と colorControlActivated の指定が効かないからです。 このへんは中のコードを読めていないのですが、ActivityやApplicationで指定しているテーマのスタイルが適用されてしまうようです。 <android.support.v7.widget.AppCompatEditText android:id="@+id/edit_text" style="@style/EditTextStyle" android:layout_width="match_parent" android:layout_heig
よくわかるマテリアルデザインの設計コンセプト | fladdict
iPhoneとAndroidではiPhoneのほうが良くできているが、iOSのフラットデザインとAndroidのマテリアルデザインでは後者の設計が優れている。マテリアルデザインは、デザインとエンジニアリングが高いレベルで融合していて、ロジカルで非常に美しい。 以下、自分の理解をまとめたメモ。 紙とインク マテリアルデザインは「ペーパー」と「インク」のメタファーでできている。 ペーパーの特徴 バーやボタンといった画面上のUIコンポーネントは、バーチャルな紙でできたカードと考える。また、このペーパーは1dpの厚さを持っている。 ペーパーは純白の矩形、あるいはシンプルな円形である。三角や星型といった複雑な形はとらない。そのような複雑な形状や模様はインクが担当する。 現実とことなり、このペーパーは自由に伸縮することができる。 マテリアルデザインにおけるレイアウトは、複数のペーパーを並べたり、重ねた
Material Design？言いたい事はわかった。だがどうやって実装しろと？そんなあなたに贈るMaterial Design対応ライブラリ集 - Qiita
Material Design？言いたい事はわかった。だがどうやって実装しろと？そんなあなたに贈るMaterial Design対応ライブラリ集AndroidGitHubMaterialDesign Material Designに対応しているライブラリをコンポーネント別にまとめてみました。 一応 GoogleのMaterial Designを説明しているcomponents と同じ順で、ライブラリとスクリーンショットをつらつら並べてみました。 Buttom sheets BottomSheet ダイアログを実装する間隔で使えます。 Buttons MaterialDesignLibrary ○Flat Button ○Rectangle Button ○Float Button ○Float Small Button FloatingActionButton Google+のようなFlo
Material Design を全力で取り込んだはてなブックマークリーダーを作ってみた - Qiita
はじめに はてなブックマークのカテゴリをスワイプでシュッシュッと切り替えられるアプリがあったら使いやすいかなぁ、ということで作ってみました。 Material Design のエッセンスをできる限り取り入れましたので、注意した点などを紹介します。現行のアプリに導入できる内容もあると思いますので、参考になれば幸いです。 （追記）「階層」の概念、実装コストの高いものについては、実装の対象外としております。 （再追記）タブバー、トップバーの下にスクロールに合わせてシャドーを表示する変更をしました。 アプリはこんな感じです。ご指摘やご要望などありましたらコメントいただけると嬉しいです。 https://play.google.com/store/apps/details?id=com.appspot.parisienneapps.hatebureader レイアウト、コンポーネント アップバー レ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ログイン - はてな
Adjust icon size of Floating action button (fab)
http://weblog.metacircular-evaluator.org/blog/2015/03/05/changing-actionbar-title-fontsize/
http://www.android4devs.com/2014/12/how-to-make-material-design-app.html
Status Bar Color not showing - 5.0 Lollipop Android Studio: (AppCompat-v7:r21)
Material Design