בוחר אמוג'י

הכלי לבחירת אמוג'י הוא פתרון לממשק המשתמש שמציע מראה ועיצוב מודרניים, סמלי אמוג'י עדכניים וקלות שימוש. המשתמשים יכולים לעיין בסמלי אמוג'י ובגרסאות שלהם ולבחור אותם, או לבחור מבין סמלי האמוג'י שבהם השתמשו לאחרונה.

איור 1. בוחר אמוג'י

בעזרת הספרייה הזו, אפליקציות ממגוון מקורות יכולות לספק למשתמשים חוויית שימוש מקיפה ומאוחדת באמוג'י, בלי שמפתחים יצטרכו ליצור ולתחזק בורר אמוג'י משלהם מאפס.

תכונות

לבורר האמוג'י יש את התכונות הבאות.

סמלי אמוג'י עדכניים

סמלי אמוג'י חדשים שפורסמו נכללים באופן סלקטיבי בבוחר האמוג'י. ספריית האמוג'י של בורר האמוג'י תואמת לכמה גרסאות Android ומכשירים.

וריאציות דביקות

לוחצים לחיצה ארוכה על אמוג'י כדי להציג תפריט של וריאציות, כמו מגדר או גוון עור שונים. הווריאנט שבוחרים נשמר בבורר האמוג'י, והווריאנט האחרון שנבחר משמש בחלונית הראשית.

בעזרת התכונה הזו, המשתמשים יכולים לשלוח בהקשה אחת את וריאציות האמוג'י המועדפות עליהם.

וריאציות של אמוג'י
איור 2. וריאציות של אמוג'י.

אמוג'י מהזמן האחרון

אמוג'י מהזמן האחרון
איור 3. אמוג'י מהזמן האחרון.

RecentEmojiProvider אחראים לספק את האמוג'י בקטגוריה בשימוש לאחרונה. בספרייה יש ספק אמוג'י ברירת מחדל עדכני שמתאים לתרחיש לדוגמה הנפוץ ביותר:

  • כל האמוג'י שנבחרו נשמרים בכל אפליקציה בנפרד בהעדפות המשותפות.
  • בבורר מוצגות עד שלוש שורות של אמוג'י שנבחרו, ללא כפילויות, בסדר כרונולוגי הפוך.

אם התנהגות ברירת המחדל הזו מספיקה, אין צורך להשתמש ב-setRecentEmojiProvider().

עם זאת, ייתכן שיהיה צורך להתאים אישית את התנהגות הספק. הנה כמה תרחישים נפוצים:

  • אתם רוצים לשמור אמוג'י נבחרים שונים לכל חשבון משתמש.
  • אתם רוצים להשתמש באחסון נתונים שאינו העדפות משותפות.
  • אתם רוצים להציג סמלי אמוג'י אחרונים, ממוינים לפי תדירות.

לאחר מכן תוכלו להטמיע את הממשק RecentEmojiProvider ולהגדיר אותו באמצעות setRecentEmojiProvider().

בורר הכיוונים

החל מ-Emoji 15.1, בוחר האמוג'י תומך בסמלי אמוג'י דו-כיווניים. המשתמשים יכולים להקיש על המתג הדו-כיווני כדי לעבור בין הגרסאות של האמוג'י הפונות שמאלה וימינה.

אמוג'י דו-כיווני שמאלה

איור 4. אמוג'י דו-כיווני פונה שמאלה.

אמוג'י דו-כיווני שמאלה

איור 5. אמוג'י דו-כיווני פונה ימינה.

בורר אמוג'י לכמה אנשים

המשתמשים יכולים ללחוץ לחיצה ארוכה על זוגות של אמוג'י, כדי לחשוף את אפשרויות האמוג'י של כמה אנשים.

לחיצה ארוכה על זוג אמוג'י

איור 6. לוחצים לחיצה ארוכה על זוג אמוג'י כדי להציג בחירות אמוג'י של מספר אנשים.

הקשה על איש האמוג'י השמאלי

איור 7. בוחרים אמוג'י של אדם בצד ימין.

מקישים על אמוג'י האדם הימני

איור 8. בוחרים אמוג'י של אדם בצד שמאל.

כשהמשתמש בוחר את איש האמוג'י מהקצה השמאלי או הימני של זוג האמוג'י, הבורר מציג תצוגה מקדימה בפינה השמאלית התחתונה, כמו שמתוארים במספרים 7 ו-8. אחרי שבוחרים את שתי הזוגות האמוג'י, המשתמשים יכולים לבחור את התצוגה המקדימה כדי להרכיב את זוג האמוג'י בהתאמה אישית.

תאימות ל-EmojiCompat

אם ההגדרה הזו מופעלת, המערכת משתמשת במכונה של EmojiCompat בבורר האמוג'י כדי להציג כמה שיותר סמלי אמוג'י. עם זאת, לא צריך להשתמש ב-EmojiCompat בבורר האמוג'י.

דרישות מוקדמות

האפליקציה שלכם צריכה לטרגט ל-Android 5.0 (רמת API‏ 21) ואילך.

שימוש בספרייה

  1. מייבאים את androidx.emoji2:emojipicker:$version לקובץ build.gradle של האפליקציה.

    dependencies {
        implementation "androidx.emoji2:emojipicker:$version"
    }
    
  2. מרחיבים את התצוגה של בורר האמוג'י, ואם רוצים מגדירים את emojiGridRows ו-emojiGridColumns.

    • ערך ברירת המחדל של emojiGridColumns הוא 9.
    • מספר השורות מחושב על סמך גובה התצוגה הראשית ועל סמך הערך של emojiGridColumns.
    • משתמשים בערך מסוג מספר ממשי (float) ב-emojiGridRows כדי לציין שהמשתמש יכול לגלול כדי למצוא עוד סמלי אמוג'י.
    <androidx.emoji2.emojipicker.EmojiPickerView
        android:id="@+id/emoji_picker"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:emojiGridColumns="9" />
    
    val emojiPickerView = EmojiPickerView(context).apply {
        emojiGridColumns = 15
        layoutParams = ViewGroup.LayoutParams(
            ViewGroup.LayoutParams.MATCH_PARENT,
            ViewGroup.LayoutParams.MATCH_PARENT
        )
    }
    
    findViewById<ViewGroup>(R.id.emoji_picker_layout).addView(emojiPickerView)
    
  3. משתמשים ב-setOnEmojiPickedListener() כדי לצרף את האמוג'י שנבחר לתצוגה. לדוגמה, כדי להוסיף לקובץ EditText:

    emojiPickerView.setOnEmojiPickedListener {
        findViewById<EditText>(R.id.edit_text).append(it.emoji)
    }
    
  4. אפשר להגדיר את RecentEmojiProvider. כדי לראות דוגמה להטמעה, ראו אפליקציה לדוגמה.

  5. אפשר גם להתאים אישית את הסגנונות. יוצרים סגנון משלכם כדי לשנות את המאפיינים הנפוצים של העיצוב ולהחיל את הסגנון על EmojiPickerView. לדוגמה, שינוי של colorControlNormal ישנה את צבע סמל הקטגוריה.

    <style name="CustomStyle" >
        <item name="colorControlNormal">#FFC0CB</item>
    </style>
    <androidx.emoji2.emojipicker.EmojiPickerView
        android:id="@+id/emoji_picker"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:theme="@style/CustomStyle"
        app:emojiGridColumns="9" />
    

אפליקציה לדוגמה

באפליקציה לדוגמה של Emoji Picker מוצגים תרחישים לדוגמה לשימוש ב-Emoji Picker, לצד התרחישים הנוספים הבאים:

  • חישוב מחדש של הפריסה כשemojiGridRows או emojiGridColumns מתאפסים.
  • ספק אמוג'י שהוגדר מחדש לאחרונה, שממיין לפי תדירות.
  • התאמה אישית נוספת של הסגנון.