elevation
<ImageView … android:elevation="8dp" />
getElevation()/setElevation()
drawable
getOutline()
<android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content"> <!--カードのコンテンツ --> </android.support.v7.widget.CardView>
CardView
FrameLayout
cardElevation
cardCornerRadius
android:fontFamily="sans-serif-medium"
android:textAppearance="@android:style/TextAppearance.Material.Title"
Title
AppCompat
“@style/TextAppearance.AppCompat.Title”
colorPrimary
Action Bar
colorAccent
EditText
Switch
colorPrimaryDark
Status Bar
colorControlNormal、colorControlActivated、colorControlHighlight、colorButtonNormal、colorSwitchThumbNormal、colorEdgeEffect、statusBarColor、navigationBarColor
Palette.generateAsync(bitmap, new Palette.PaletteAsyncListener() { @Override public void onGenerated(Palette palette) { Palette.Swatch vibrant = palette.getVibrantSwatch(); if (swatch != null) { // 明るい色があるときは // タイトルの TextView を更新する titleView.setBackgroundColor( vibrant.getRgb()); titleView.setTextColor( vibrant.getTitleTextColor()); } } });
album_grid.xml … <Imageview … android:transitionname="@string/transition_album_cover" /> album_details.xml … <Imageview … android:transitionname="@string/transition_album_cover" /> AlbumActivity.java Intent intent = new Intent(); String transitionName = getString(R.string.transition_album_cover); … ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation(activity, albumCoverImageView, // 遷移がはじまるビュー transitionName // 遷移先のビューの transitionName ); ActivityCompat.startActivity(activity, intent, options.toBundle());
transitionName
Theme.Material
Button
?android:selectableItemBackground
Ripple
<ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="@color/accent_dark"> <item> <shape android:shape="oval"> <solid android:color="?android:colorAccent" /> </shape> </item> </ripple>
translationZ
Z = elevation + translationZ
stateListAnimator
Buttons
layout/your_layout.xml <Imagebutton ... android:statelistanimator="@anim/raise" /> anim/raise.xml <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_enabled="true" android:state_pressed="true"> <objectAnimator android:duration="@android:integer/config_shortAnimTime" android:propertyname="translationZ" android:valueto="@dimen/touch_raise" android:valuetype="floatType" /> </item> <item> <objectAnimator android:duration="@android:integer/config_shortAnimTime" android:propertyname="translationZ" android:valueto="0dp" android:valuetype="floatType" /> </item> </selector>
Animator
Animator reveal = ViewAnimationUtils.createCircularReveal( viewToReveal, // Reveal するための新しいビュー centerX, // マスク中心の x 座標 centerY, // マスク中心の y 座標 startRadius, // 開始時のマスクの半径 endRadius); // 完了時のマスクの半径 reveal.start();
Toolbar
Activity.setActionBar()
Activity
res/ mipmap-mdpi/ ic_launcher.png mipmap-hdpi/ ic_launcher.png mipmap-xhdpi/ ic_launcher.png mipmap-xxhdpi/ ic_launcher.png mipmap-xxxhdpi/ ic_launcher.png # Nexus 6 の launcher で使用されるアプリアイコン
res/ drawable-mdpi/ ic_sunny.png drawable-hdpi/ ic_sunny.png drawable-xhdpi/ ic_sunny.png drawable-xxhdpi/ # xxxhdpi 版がないときは、こちらを使用 ic_sunny.png drawable-xxxhdpi/ # Nexus 6 用の高解像度素材 ic_sunny.png
APP_ABI := armeabi armeabi-v7a arm64-v8a x86 x86_64 mips mips64
<menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/menu_create" android:title="@string/menu_create" android:alphabeticShortcut="c” /> </menu/>
In MainActivity.java: @Override public boolean onKeyShortcut(int keyCode, KeyEvent event) { switch (keyCode) { case KeyEvent.KEYCODE_R: Toast.makeText(this, "Reply", Toast.LENGTH_SHORT).show(); return true; default: return super.onKeyShortcut(keyCode, event); } }
res/layout/activity_main.xml
res/layout-w600dp/activity_main.xml
res/layout-w720dp/activity_main.xml
In res/values/styles.xml: <style name="DescriptionTextStyle"> <item name="android:textAppearance">?android:attr/textAppearanceMedium</item> </style>
In res/values-sw600dp/styles.xml: <style name="DescriptionTextStyle"> <item name="android:textAppearance">?android:attr/textAppearanceLarge</item> </style>
dependencies { compile "com.android.support:appcompat-v7:21.0.+" }
values/themes.xml: <style name="Theme.MyTheme" parent="Theme.AppCompat.Light"> <!-- AppCompat の actionBarStyle を設定 --> <item name="actionBarStyle">@style/MyActionBarStyle</item> <!-- AppCompat の color theming attrs を設定 --> <item name=”colorPrimary”>@color/myawesomered</item> <item name=”colorPrimaryDark”>@color/myawesomedarker_red</item> <!-- 他の属性 --> </style>
values/themes.xml: <style name="Theme.MyTheme" parent="Theme.AppCompat.Light"> <!-- colorPrimary is used for the default action bar background --> <item name=”colorPrimary”>@color/my_awesome_color</item> <!-- status bar には colorPrimaryDark が使用されます --> <item name=”colorPrimaryDark”>@color/my_awesome_darker_color</item> <!-- ウィジェットに色合いを付ける colorControlActivated のデフォルト値として colorAccent が使用されます --> <item name=”colorAccent”>@color/accent</item> <!-- 他にも colorControlNormal、colorControlActivated、 colorControlHighlight と colorSwitchThumbNormalを設定できます --> </style>
<android.support.v7.widget.Toolbar android:id=”@+id/my_awesome_toolbar” android:layout_height=”wrap_content” android:layout_width=”match_parent” android:minHeight=”?attr/actionBarSize” android:background=”?attr/colorPrimary” />
@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.blah); Toolbar toolbar = (Toolbar) findViewById(R.id.myawesometoolbar); setSupportActionBar(toolbar); }
@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.blah); Toolbar toolbar = (Toolbar) findViewById(R.id.myawesometoolbar); // メニューアイテムのクリックに対応するために、OnMenuItemClickListener を設定 toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem item) { // メニューアイテムに対応 return true; } }); // toolbar に表示されるようにメニューを inflate toolbar.inflateMenu(R.menu.yourtoolbarmenu); }
<android.support.v7.widget.Toolbar android:layoutheight="wrapcontent" android:layoutwidth="matchparent" android:minHeight="?attr/actionBarSize" app:theme="@style/ThemeOverlay.AppCompat.ActionBar" />
app:theme
<android.support.v7.widget.Toolbar android:layoutheight=”wrapcontent” android:layoutwidth=”matchparent” android:minHeight=”@dimen/tripleheighttoolbar” app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
values/themes.xml: <style name=”Theme.MyTheme” parent=”Theme.AppCompat”> <item name=”searchViewStyle”>@style/MySearchViewStyle</item> </style> <style name=”MySearchViewStyle” parent=”Widget.AppCompat.SearchView”> <!-- 検索クエリ部分（EditText など）の背景 --> <item name="queryBackground">...</item> <!-- アクション部分（voice、submit など）の背景 --> <item name="submitBackground">...</item> <!-- Close ボタンアイコン --> <item name="closeIcon">...</item> <!-- Search ボタンアイコン --> <item name="searchIcon">...</item> <!-- Go/commit ボタンアイコン --> <item name="goIcon">...</item> <!-- Voice search ボタンアイコン --> <item name="voiceIcon">...</item> <!-- クエリ サジェスチョン行に表示される Commit アイコン --> <item name="commitIcon">...</item> <!-- クエリ サジェスチョン行の レイアウト --> <item name="suggestionRowLayout">...</item> </style>
.gif){kind=spacer}
