Senin Yani build.gradle
dosyada, bu ekleyin:
compile 'com.android.support:design:27.1.1'
AndroidX Notu: Google, eski Destek Kitaplıklarının yerini alacak yeni AndroidX uzantı kitaplıkları sunuyor. AndroidX kullanmak için ilk marka emin size güncelledik gradle.properties
dosyayı düzenlenebilir, build.gradle
sete compileSdkVersion
için 28
(veya üstü) ve önceki yerine aşağıdaki satırını kullanın compile
biri.
implementation 'com.google.android.material:material:1.0.0'
Sonra, sizin themes.xml
veya styles.xml
her neyse, bunu ayarladığınızdan emin olun - bu, uygulamanızın vurgu rengidir - ve siz onu geçersiz kılmadığınız sürece FAB'nizin rengidir (aşağıya bakın):
<item name="colorAccent">@color/floating_action_button_color</item>
Düzenin XML'inde:
<RelativeLayout
...
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.design.widget.FloatingActionButton
android:id="@+id/myFAB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_plus_sign"
app:elevation="4dp"
... />
</RelativeLayout>
Veya yukarıdaki AndroidX materyal kitaplığını kullanıyorsanız, bunun yerine şunu kullanırsınız:
<RelativeLayout
...
xmlns:app="http://schemas.android.com/apk/res-auto">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/myFAB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:srcCompat="@drawable/ic_plus_sign"
app:elevation="4dp"
... />
</RelativeLayout>
Dokümanlarda daha fazla seçenek görebilirsiniz (malzeme dokümanları burada) ( setRippleColor
vb.), Ancak notlardan biri:
app:fabSize="mini"
Bir başka ilginç olanı - sadece bir FAB'ın arka plan rengini değiştirmek için şunu ekleyin:
app:backgroundTint="#FF0000"
(örneğin kırmızıya çevirmek için) yukarıdaki XML'e.
Her neyse, kodda, Etkinlik / Parçanın görünümü şişirildikten sonra ....
FloatingActionButton myFab = (FloatingActionButton) myView.findViewById(R.id.myFAB);
myFab.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
doMyThing();
}
});
Gözlemler:
- Eğer iki görünümü ayıran (örneğin bir RelativeLayout kullanarak) bir "dikiş" üzerinde olan bu düğmelerden birine sahipseniz, örneğin, kenarlığı örtmek için negatif bir alt düzen marjı ile, bir sorun fark edeceksiniz: FAB'ın boyutu aslında lolipop öncesi lolipoptan çok farklı . API'ler arasında geçiş yaptığınızda bunu AS'nin görsel düzen düzenleyicisinde görebilirsiniz - pre-lolipop'a geçtiğinizde aniden "patlar". Ekstra boyutun nedeni, gölgenin görüşün boyutunu her yönde genişletmesi gibi görünüyor. Öyleyse, diğer şeylere yakınsa FAB'ın marjlarını ayarlarken bunu hesaba katmalısınız.
Çok fazlaysa dolguyu kaldırmanın veya değiştirmenin bir yolu:
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
RelativeLayout.LayoutParams p = (RelativeLayout.LayoutParams) myFab.getLayoutParams();
p.setMargins(0, 0, 0, 0); // get rid of margins since shadow area is now the margin
myFab.setLayoutParams(p);
}
Ayrıca, FAB'ın yüksekliğini alarak, ikiye bölerek ve bunu marj ofseti olarak kullanarak bir RelativeLayout'ta iki alan arasındaki "dikiş" üzerine FAB'yi programlı olarak yerleştirecektim. Ancak myFab.getHeight (), görünüm şişirildikten sonra bile sıfır döndürdü, öyle görünüyordu. Bunun yerine yüksekliği yalnızca yerleştirildikten sonra almak için bir ViewTreeObserver kullandım ve ardından konumu belirledim. Bu ipucuna buradan bakın
. Şöyle görünüyordu:
ViewTreeObserver viewTreeObserver = closeButton.getViewTreeObserver();
if (viewTreeObserver.isAlive()) {
viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN) {
closeButton.getViewTreeObserver().removeGlobalOnLayoutListener(this);
} else {
closeButton.getViewTreeObserver().removeOnGlobalLayoutListener(this);
}
// not sure the above is equivalent, but that's beside the point for this example...
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) closeButton.getLayoutParams();
params.setMargins(0, 0, 16, -closeButton.getHeight() / 2); // (int left, int top, int right, int bottom)
closeButton.setLayoutParams(params);
}
});
}
Bunu yapmanın doğru yolu olup olmadığından emin değilim, ama işe yarıyor gibi görünüyor.
- Görünüşe göre yüksekliği azaltarak düğmenin gölge alanını küçültebilirsiniz.
FAB'ın bir "dikiş" üzerinde olmasını istiyorsanız, kullanabilirsiniz layout_anchor
ve layout_anchorGravity
işte bir örnek:
<android.support.design.widget.FloatingActionButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:layout_anchor="@id/appbar"
app:layout_anchorGravity="bottom|right|end"
android:src="@drawable/ic_discuss"
android:layout_margin="@dimen/fab_margin"
android:clickable="true"/>
Bir Snackbar geldiğinde, onu bir Koordinatör Düzenine sararak otomatik olarak düğmenin yoldan çıkmasını sağlayabileceğinizi unutmayın .
Daha: