फ़्लोटिंग एक्शन बटन के आइकन आकार (फ़ैब) को समायोजित करें

Question

नया फ्लोटिंग एक्शन बटन 56dp x 56dp होना चाहिए और इसके अंदर का आइकन 24dp x 24dp होना चाहिए । तो आइकन और बटन के बीच का स्थान 16dp होना चाहिए ।

<ImageButton
    android:id="@+id/fab_add"
    android:layout_width="56dp"
    android:layout_height="56dp"
    android:layout_gravity="bottom|right"
    android:layout_marginBottom="16dp"
    android:layout_marginRight="16dp"
    android:background="@drawable/ripple_oval"
    android:elevation="8dp"
    android:src="@drawable/ic_add_black_48dp" />

ripple_oval.xml

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?android:colorControlHighlight">
    <item>
        <shape android:shape="oval">
            <solid android:color="?android:colorAccent" />
        </shape>
    </item>
</ripple>

और यह परिणाम है जो मुझे मिलता है:

मैंने आइकन का उपयोग \ Material-design-icons-1.0.0-content \ drawable-hdpi \ ic_add_black_48dp.png
https://github.com/google/material-design-icons/releases से किया था /tag/1.0.1

कैसे बनाने के लिए आइकन के आकार बटन के अंदर जा बिल्कुल के रूप में दिशा-निर्देशों में बताया गया?

http://www.google.com/design/spec/components/buttons.html#buttons-floating-action-button

Comments

की संभावित डुप्लिकेट: stackoverflow.com/a/59455009/3974530

— InsaneCat

@InsaneCat शायद दूसरा तरीका है क्योंकि आपके द्वारा उल्लिखित प्रश्न मेरा हाल ही का है।

— वोवहस्त

Answer 1

जैसे आपकी सामग्री 24dp x 24dp है, आपको 24dp आइकन का उपयोग करना चाहिए । और फिर android:scaleType="center"ऑटो आकार से बचने के लिए अपने ImageButton में सेट करें।

Comments

क्या आप किसी साइट का लिंक समझा सकते हैं या छोड़ सकते हैं, उदाहरण के लिए क्यों - एचडीपीआई फ़ोल्डर में _18dp.png, _24dp.png, _36dp.png, _48dp.png चित्र हैं।

— वोवहॉस्ट

मैं आपके प्रश्न को नहीं समझता, विभिन्न आकार के चित्रों के लिए 18dp, 24dp, 36dp और 48dp हैं।

— गातन एम

क्या आपको पुराना Android_Design_Icons याद है, जिसमें एचडीपीआई फ़ोल्डर में आइकन का केवल एक संस्करण था, जो 48px / 48px था। अब एचडीपीआई फोल्डर में एक ही आइकन के लिए 4 अलग-अलग रिज़ॉल्यूशन क्यों हैं। 27px x 27 px, 36px x 36px, 54px x 54px, 72px x 72px?

— वोवहॉस्ट

ImageButton ImageView का एक उपवर्ग है, इसलिए आपके पास एक पैमाना है जो जिम्मेदार है और डिफ़ॉल्ट पैमाना है ScaleType.FIT_CENTER

— Gaëtan M.

अब com.android.support:support-v4:28.0.0-rc01 के साथ काम नहीं करता है

— StarWind0

Answer 2

इस प्रविष्टि को डिमेंस में बनाएं

<!--Floating action button-->
<dimen name="design_fab_image_size" tools:override="true">36dp</dimen>

यहाँ 36dp फ्लोटिंग पॉइंट बटन पर आइकन का आकार है। यह फ्लोटिंग एक्शन बटन के लिए सभी आइकनों के लिए 36dp आकार निर्धारित करेगा।

अद्यतन प्रति टिप्पणी के रूप में

यदि आप आइकन आकार को विशेष रूप से फ्लोटिंग एक्शन बटन पर सेट करना चाहते हैं, तो बस ऐप जैसे फ्लोटिंग एक्शन बटन विशेषताओं के साथ जाएं: fabSize = "normal" और android: scaleType = "center"।

  <!--app:fabSize decides size of floating action button You can use normal, auto or mini as per need-->
  app:fabSize="normal" 

  <!--android:scaleType decides how the icon drawable will be scaled on Floating action button. You can use center(to show scr image as original), fitXY, centerCrop, fitCenter, fitEnd, fitStart, centerInside.-->
  android:scaleType="center"

Comments

यह वही है जो मुझे चाहिए था - सरल और आसान। पोस्ट करने का शुक्रिया।

— ब्लिस्टरपैंट्स

हाँ। यह github.com/Clans/FloatingActionButton के साथ काम नहीं करता है । यह तब काम करता है जब आप Android का उपयोग कर रहे हैं फ्लोटिंगएशनबटन

— अभिषेक

Yeaaaah लेकिन मैं इसे एप्लिकेशन भर में नहीं करना चाहता!

— StarWind0

@ StarWind0 यदि आप सिंगल फ्लोटिंग एक्शन बटन के लिए आवेदन करना चाहते हैं, तो आपको फैबसाइज़ और स्केलपाइप विशेषताओं का उपयोग करना होगा। मैंने अपना उत्तर अपडेट कर दिया है।

— अभिषेक

Answer 3

app:maxImageSize="56dp"अपने समर्थन पुस्तकालय को v28.0.0 में अपडेट करने के बाद उपरोक्त उत्तरों के बजाय उपयोग करने का प्रयास करें

Comments

किसी भी तरह से, आपको यह 28.0.0 संस्करण में नहीं मिलता है, यह आपको androidx में मिलेगा।

— खेमराज

मैंने AndroidX पर स्विच नहीं किया है, यह वही है जो मैं उपयोग कर रहा हूं: एपीआई 'com.android.support:design:28.0.0'

— रॉबिन

इसने मेरे लिए काम किया लेकिन मुझे यह समझने में अधिक जानकारी चाहिए कि maxIconSizeआइकन के आकार में बदलाव को क्यों परिभाषित किया जाए ।

— स्ट्रॉम

Answer 4

कस्टम FABs के लिए तीन प्रमुख XML विशेषताएँ हैं:

• app:fabSize: या तो "मिनी" (40dp), "सामान्य" (56dp) (डिफ़ॉल्ट) या "ऑटो"
• app:fabCustomSize: यह समग्र एफएबी आकार तय करेगा।
• app:maxImageSize: यह आइकन का आकार तय करेगा।

---

उदाहरण:

app:fabCustomSize="64dp" 
app:maxImageSize="32dp"

FAB पैडिंग (आइकन और बैकग्राउंड सर्कल, उर्फ रिपल के बीच का स्थान ) की अनुमानित रूप से गणना की जाती है:

4-edge padding = (fabCustomSize - maxImageSize) / 2.0 = 16

---

ध्यान दें कि फैब का मार्जिन सामान्य android:marginxml टैग गुणों द्वारा निर्धारित किया जा सकता है ।

Answer 5

डिज़ाइन दिशानिर्देश दो आकारों को परिभाषित करता है और जब तक कि किसी भी तरह से उपयोग करने से विचलित करने का एक मजबूत कारण नहीं है, तो आकार fabSizeको FloatingActionButtonघटक की XML विशेषता के साथ नियंत्रित किया जा सकता है ।

app:fabSize="normal"या तो का उपयोग करके निर्दिष्ट करने पर विचार करें app:fabSize="mini", जैसे:

<android.support.design.widget.FloatingActionButton
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:src="@drawable/ic_done_white_24px"
   app:fabSize="mini" />

Answer 6

<ImageButton
        android:background="@drawable/action_button_bg"
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:padding="16dp"
        android:src="@drawable/ic_add_black_48dp"
        android:scaleType="fitXY"
        android:elevation="8dp"/>

पृष्ठभूमि के साथ आपने इसे मेरे डिवाइस पर नीचे दिए गए बटन में परिणाम दिया (Nexus 7 2012)

मुझे ठीक लगता है।

Comments

मैं पैडिंग सेट करता हूं लेकिन यह कुछ नहीं करता है। और सही गद्दी 16 dp नहीं 32dp होगी

— vovahost

Answer 7

आपका लक्ष्य क्या है?

यदि आइकन छवि का आकार बड़ा हो तो:

1. अपने लक्ष्य आकार की तुलना में एक बड़ा छवि आकार सुनिश्चित करें (so you can set max image size for your icon)

2. मेरा लक्ष्य आइकन छवि आकार 84dp और फैब आकार 112dp है :

   <android.support.design.widget.FloatingActionButton
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_gravity="center"
       android:src= <image here>
       app:fabCustomSize="112dp"
       app:fabSize="auto"
       app:maxImageSize="84dp" />

Answer 8

यदि आप androidx 1.0.0 का उपयोग कर रहे हैं और एक कस्टम फैब आकार का उपयोग कर रहे हैं, तो आपको उपयोग करके कस्टम आकार निर्दिष्ट करना होगा

app:fabCustomSize="your custom size in dp"

बधिरता द्वारा आकार 56dp है और एक और भिन्नता है कि छोटे आकार का फैब है जो 40dp है, यदि आप कुछ भी उपयोग कर रहे हैं तो आपको इसे सही तरीके से गणना करने के लिए पैडिंग के लिए निर्दिष्ट करना होगा।

Comments

यही वह है जिसकी तलाश में मैं हूं! तुम भी सेट की जरूरत नहीं है layout_widthऔर layout_height। यह सिर्फ काम करता है। यह भी उपलब्ध हैcom.android.support:design:28.0.0

— PNDA

Answer 9

जैसा FABहै, ImageViewवैसे ही आप scaleTypeआइकन का आकार बदलने के लिए विशेषता का उपयोग कर सकते हैं ImageView। scaleTypeएक के लिए डिफ़ॉल्ट FABहै fitCenter। आप उपयोग कर सकते हैं centerऔर centerInsideक्रमश: छोटे और बड़े आइकन बनाने के लिए।

scaleTypeविशेषता के लिए सभी मान हैं - center, centerCrop, centerInside, fitCenter, fitEnd, fitStart, fitXYऔर matrix।

अधिक विवरण के लिए https://developer.android.com/reference/android/widget/ImageView.ScaleType.html देखें ।

Answer 10

वेक्टर ड्रिबल सेटिंग में @ इरडा के जवाब से हटकर जो भी साइज सेट किया गया था, उसके android:height="_dp" लिए स्केल टाइप android:scaleType="center"सेट करना

Answer 11

आप फ़्लोटिंगएशनबटन की निम्न सेटिंग्स के साथ खेल सकते हैं: Android: scaleType और app: maxImageSize। मेरे लिए, यदि Android: scaleType = "centerInside" और ऐप: maxImageSize = "56dp" हो तो मुझे एक वांछनीय परिणाम मिला है।