Разве Google уже выпустил определенный стиль или компонент для этой новой круглой кнопки FAB или я должен реализовать проект самостоятельно?
Кнопка описывается здесь: Google Design | Плавающие кнопки действий
РЕДАКТИРОВАТЬ (05/2015): Проверить ответ Лукаса/Ответ Габриэле, показывающий простой способ реализовать его с помощью библиотеки поддержки дизайна.
UPDATE: теперь есть официальный виджет для FAB: FloatingActionButton, см. Габриэле Мариотти для получения полной информации.
По словам Адама Пауэлла и Чет Хаазе, они не создали виджет для кнопки FAB, потому что это очень простой компонент для воспроизведения.
В речи Google IO 2014 возник вопрос: "Google I/O 2014 -" Материаловедение: разработка приложений для Android с материальным дизайном ", в конце выступления (примерно в 37:50) был именно этот вопрос, вы можете услышать это здесь: https://www.youtube.com/watch?v=lSH9aKXjgt8#t=2280
Chet Haase говорит, что RoundedBitmapDrawable (я не проверял, что это имя), который должен уже выполнять задачу определения Outline.
Но вы можете сделать это с помощью собственного рисования, установить для него возвышенность и программно определить круг Outline.
Это должно дать вам круглую кнопку с теневым выпуском L. Но я думаю, что вам нужно будет создать Shadow pre-L самостоятельно.
Я должен проверить код для CardView, чтобы увидеть, как он воспроизводит тени pre-L. Я, наверное, сделаю это, но у меня нет времени. Если никто не появится с подробностями, я сделаю это после того, как найду время, чтобы проверить его.
EDIT:
Габриэле Мариотти (см. его ответ ниже, спасибо) добавил код, чтобы показать вам, как это сделать.
Благодаря комментариям @shomeser он написал библиотеку, чтобы сделать кнопку fab:
https://github.com/shamanland/floating-action-button
Чтобы использовать его:
dependencies {
compile 'com.shamanland:fab:0.0.3'
}
Вы также можете прочитать его ответ на другой вопрос: Как добавить новую "плавучую кнопку действия" ? между двумя виджетами/макетами
ОБНОВЛЕНО: 16/08/2019 официальными компонентами Материал для библиотеки Android
С новыми Материальными компонентами для Android добавьте в свой build.gradle:
implementation 'com.google.android.material:material:1.0.0'
Затем добавьте в свой макет:
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/floating_action_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_margin="16dp"
app:srcCompat="@drawable/ic_plus_24"/>
И используйте это:
FloatingActionButton floatingActionButton =
(FloatingActionButton) findViewById(R.id.floating_action_button);
floatingActionButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
// Handle the click.
}
});
Если вы используете тему материала, например Theme.MaterialComponents, ваш FAB унаследует стиль материала. В противном случае просто примените стиль @style/Widget.MaterialComponents.FloatingActionButton
<com.google.android.material.floatingactionbutton.FloatingActionButton
....
style="@style/Widget.MaterialComponents.FloatingActionButton"
..../>
Дополнительная информация здесь.
ОБНОВЛЕНО: 30/05/2015 с официальной библиотекой поддержки проектирования
Там официальный виджет сейчас.
Просто добавьте эту зависимость в свой build.gradle
compile 'com.android.support:design:22.2.0'
Добавьте этот вид в свой макет:
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:src="@drawable/ic_done" />
И используйте это:
FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
//TODO
}
});
ОБНОВЛЕНО: 12/12/2014 с кодом Android 5
Также вы можете добавить и stateListAnimator к своей кнопке:
<Button
android:stateListAnimator="@anim/anim"
/>
Где anim.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:valueFrom="@dimen/button_elevation"
android:valueTo="@dimen/button_press_elevation"
android:valueType="floatType" />
</item>
<item>
<objectAnimator
android:duration="@android:integer/config_shortAnimTime"
android:propertyName="translationZ"
android:valueFrom="@dimen/button_press_elevation"
android:valueTo="@dimen/button_elevation"
android:valueType="floatType" />
</item>
</selector>
Dimens.xml - это
<resources>
<dimen name="fab_size">56dp</dimen>
<dimen name="button_elevation">2dp</dimen>
<dimen name="button_press_elevation">4dp</dimen>
</resources>
Проверьте ответ даниэле.
О набросках упоминается Даниэле. Добавьте атрибут высоты к своей кнопке и установите схему с помощью кода:
<ImageButton
android:background="@drawable/ripple"
android:stateListAnimator="@anim/anim"
android:src="@drawable/ic_action_add"
android:elevation="4dp"
/>
О набросках:
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.layoutfab);
//Outline: OLD METHOD IN L-PREVIEW
//int size = getResources().getDimensionPixelSize(R.dimen.fab_size);
//Outline outline = new Outline();
//outline.setOval(0, 0, size, size);
//findViewById(R.id.fab).setOutline(outline);
Button fab = (Button) findViewById(R.id.fab);
ViewOutlineProvider viewOutlineProvider = new ViewOutlineProvider() {
@Override
public void getOutline(View view, Outline outline) {
// Or read size directly from the view width/height
int size = getResources().getDimensionPixelSize(R.dimen.fab_size);
outline.setOval(0, 0, size, size);
}
};
fab.setOutlineProvider(viewOutlineProvider);
}
}
Google теперь предоставляет официальную библиотеку, называемую библиотекой дизайна, , содержащую кнопку Fab. Просто добавьте следующую зависимость Gradle:
compile 'com.android.support:design:22.2.0'
Затем вы можете использовать кнопку fab следующим образом:
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
Более подробную информацию можно найти в своем объявлении
http://android-developers.blogspot.ch/2015/05/android-design-support-library.html
или на странице javadoc
http://developer.android.com/reference/android/support/design/widget/FloatingActionButton.html
Так как функция ярлыков FAB (например, в приложениях Evernote или Inbox) была добавлена в эту удивительную библиотеку, не стесняйтесь ее использовать:
Gradle зависимость:
compile 'com.getbase:floatingactionbutton:1.3.0'
layout.xml:
<com.getbase.floatingactionbutton.FloatingActionsMenu
android:id="@+id/multiple_actions"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
fab:fab_addButtonColorNormal="@color/white"
fab:fab_addButtonColorPressed="@color/white_pressed"
fab:fab_addButtonPlusIconColor="@color/half_black"
fab:fab_labelStyle="@style/menu_labels_style"
android:layout_marginBottom="16dp"
android:layout_marginRight="16dp"
android:layout_marginEnd="16dp">
<com.getbase.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/white"
fab:fab_title="Action A"
fab:fab_colorPressed="@color/white_pressed"/>
<com.getbase.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/white"
fab:fab_title="Action B"
fab:fab_colorPressed="@color/white_pressed"/>
</com.getbase.floatingactionbutton.FloatingActionsMenu>
menu_labels_style.xml:
<style name="menu_labels_style">
<item name="android:background">@drawable/fab_label_background</item>
<item name="android:textColor">@color/white</item>
</style>
fab_label_background.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/black_semi_transparent"/>
<padding
android:left="16dp"
android:top="4dp"
android:right="16dp"
android:bottom="4dp"/>
<corners
android:radius="2dp"/>
</shape>
Наслаждайтесь!