तो अपनी build.gradle
फ़ाइल में, इसे जोड़ें:
compile 'com.android.support:design:27.1.1'
AndroidX नोट: Google पुराने समर्थन पुस्तकालयों को बदलने के लिए नई AndroidX एक्सटेंशन लाइब्रेरी शुरू कर रहा है । AndroidX का उपयोग करने के लिए, पहले यह सुनिश्चित करgradle.properties
लें कि आपने अपनी फ़ाइल को अपडेट कर लिया है , जिसे पहले (या उच्चतर) build.gradle
सेट compileSdkVersion
करने के लिए संपादित किया गया है 28
, और पिछले compile
एक के बजाय निम्नलिखित लाइन का उपयोग करें ।
implementation 'com.google.android.material:material:1.0.0'
इसके बाद, अपने themes.xml
या styles.xml
जो भी हो, सुनिश्चित करें कि आप इसे सेट करते हैं- यह आपके ऐप का उच्चारण रंग है- और आपके FAB का रंग जब तक आप इसे ओवरराइड नहीं करते (नीचे देखें):
<item name="colorAccent">@color/floating_action_button_color</item>
लेआउट के XML में:
<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>
या यदि आप ऊपर AndroidX सामग्री लाइब्रेरी का उपयोग कर रहे हैं, तो आप इसके बजाय इसका उपयोग करेंगे:
<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>
आप डॉक्स में अधिक विकल्प देख सकते हैं (सामग्री डॉक्स यहाँ) ( setRippleColor
, इत्यादि), लेकिन एक नोट है:
app:fabSize="mini"
एक और दिलचस्प एक-- सिर्फ एक FAB की पृष्ठभूमि का रंग बदलने के लिए, जोड़ें:
app:backgroundTint="#FF0000"
(उदाहरण के लिए इसे लाल में बदलने के लिए) ऊपर XML में।
वैसे भी, गतिविधि के बाद कोड / फ्रैगमेंट का दृश्य फुलाया जाता है ...।
FloatingActionButton myFab = (FloatingActionButton) myView.findViewById(R.id.myFAB);
myFab.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
doMyThing();
}
});
टिप्पणियों:
- यदि आपके पास उन बटनों में से एक है जो "सीम" पर दो विचारों को विभाजित कर रहा है (उदाहरण के लिए एक RelativeLayout का उपयोग करके), के साथ, सीमा को ओवरलैप करने के लिए एक नकारात्मक तल लेआउट मार्जिन, तो आप एक मुद्दा नोटिस करेंगे: FAB का आकार वास्तव में है बहुत अलग है लॉलीपॉप बनाम प्री-लॉलीपॉप पर । जब आप APIs के बीच फ्लिप करते हैं तो आप इसे वास्तव में AS के विज़ुअल लेआउट एडिटर में देख सकते हैं - जब आप प्री-लॉलीपॉप पर स्विच करते हैं तो यह अचानक "पफ्स आउट" हो जाता है। अतिरिक्त आकार का कारण यह प्रतीत होता है कि छाया हर दिशा में दृश्य के आकार का विस्तार करती है। जब आपको अन्य सामान के करीब होने पर FAB के मार्जिन को समायोजित कर रहे हैं, तो आपको इसके लिए ध्यान देना होगा।
यदि बहुत अधिक है तो पैडिंग को हटाने या बदलने का एक तरीका है:
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);
}
इसके अलावा, मैं FAB की ऊंचाई को हथियाने, दो से विभाजित करने और मार्जिन ऑफसेट के रूप में उपयोग करके, RelativeLayout में दो क्षेत्रों के बीच "सीम" पर FAB को प्रोग्रामेटिक रूप से रखने जा रहा था। लेकिन myFab.getHeight () शून्य वापस आ गया, यहां तक कि दृश्य फुलाए जाने के बाद भी ऐसा लग रहा था। इसके बजाय मैंने ऊँचाई पाने के लिए ViewTreeObserver का उपयोग किया, इसके बाद ही इसे स्थापित किया गया और फिर स्थिति निर्धारित की। इस टिप को यहां देखें
। ऐसा लग रहा था:
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);
}
});
}
निश्चित नहीं है कि यह करने का सही तरीका है, लेकिन यह काम करने लगता है।
- ऐसा लगता है कि आप ऊंचाई कम करके बटन के छाया-स्थान को छोटा बना सकते हैं।
यदि आप एक "सीम" पर FAB चाहते हैं, तो आप इसका उपयोग कर सकते हैं layout_anchor
और layout_anchorGravity
यहां एक उदाहरण है:
<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"/>
याद रखें कि जब आप स्नैकबार कोऑर्डिनेटरनलआउट में लपेटकर आते हैं, तो आप स्वचालित रूप से उस बटन से बाहर कूद सकते हैं ।
अधिक: