הצגת סמלי אמוג'י

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

אם האפליקציה מציגה תוכן מהאינטרנט או מספקת קלט טקסט, מומלץ מאוד לתמוך בגופנים העדכניים ביותר של אמוג'י. אחרת, יכול להיות שאמוג'י מאוחר יותר יוצג כתיבה מרובעת קטנה בשם tofu (☐) או רצפי אמוג'י אחרים שעברו רינדור שגוי.

בגרסאות Android 11 (רמת API 30) וגרסאות ישנות יותר אי אפשר לעדכן את גופן הסמלי הרגשי, ולכן צריך לעדכן באופן ידני את האפליקציות שמוצגים בהן סמלי הרגשי בגרסאות האלה.

בהמשך מוצגות דוגמאות לאמוג'י מודרני.

דוגמאות גרסה
🫠 🫱🏼‍🫲🏿 🫰🏽 14.0 (ספטמבר 2021)
😶 🌫️ 🧔🏻 ♀️ 🧑🏿 ❤️ 🧑🪾 13.1 (ספטמבר 2020)
🥲 🥷🏿 🐻 ❄️ 13.0 (מרץ 2020)
🧑🏻‍🦰 🧑🏿‍🦯 👩🏻‍🤝‍👩🏼 12.1 (אוקטובר 2019)
🦩 🦻🏿 👩🏼‍🤝‍👩🏻 12.0 (פברואר 2019)

BOM מרץ 2023 (Compose UI 1.4) כולל תמיכה בגרסת האמוג'י העדכנית ביותר, כולל תאימות לאחור לגרסאות Android ישנות יותר עד API 21.

התמיכה הזו לא דורשת שינויים באפליקציה – אם אתם משתמשים ב-Text וב-TextField (Material 2 או Material 3) או ב-BasicText וב-BasicTextField, אתם מקבלים תמיכה בסמלי אמוג'י מודרניים כבר מההתחלה.

הדרך הטובה ביותר לבדוק את סמלי ה-emoji העדכניים ביותר באפליקציה היא להשתמש במכשיר אמיתי עם API 30 ואילך.

אם אתם משתמשים בפתרון מותאם אישית של אמוג'י, או אם אתם צריכים להשבית את רזולוציית ברירת המחדל של האמוג'י בחלונית הכתיבה מסיבה אחרת, תוכלו להשתמש ב-PlatformTextStyle(emojiSupportMatch):

Text(
    text = "Hello $EMOJI_TEXT",
    style = TextStyle(
        platformStyle = PlatformTextStyle(
            emojiSupportMatch = EmojiSupportMatch.None
        )/* ... */
    )
)
EmojiSnippets.kt

יכולת פעולה הדדית

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

מורחבים מ-ComponentActivity

אם Activity הוא במצב של סמל הכתיבה ComponentActivity במקום AppCompatActivity, פועלים לפי ההוראות של סמלי אמוג'י ללא AppCompat.

מכיוון שאתם לא מרחיבים את AppCompatActivity, מוסיפים את ספריית Emoji2 ליחסי התלות ומשתמשים ב-EmojiTextView בתצוגות במקום בווידג'ט TextView, כפי שמוצג בקטע הקוד הבא:

class MainActivity : ComponentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val emojiTextView: EmojiTextView = findViewById(R.id.emoji_text_view)
        emojiTextView.text = getString(R.string.emoji_text_view, EMOJI_TEXT)

        val composeView: ComposeView = findViewById(R.id.compose_view)

        composeView.apply {
            setContent {
                // compose code
            }
        }
    }
}
EmojiSnippets.kt

לאחר מכן, בקובץ ה-XML:

<androidx.emoji2.widget.EmojiTextView
    android:id="@+id/emoji_text_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    />
example_view.xml

הרחבה מ-AppCompatActivity

אם Activity נמשך מ-AppCompatActivity, אפשר להשתמש ב-ComposeView כדי לקרוא לפונקציות קומפוזביליות. כשמשתמשים ברכיבי טקסט מותאמים אישית, סמלי האמוג'י מוצגים בצורה תקינה בכל הגרסאות של Android.

אם אתם מרחיבים מ-AppCompatActivity, צריך לנפח את TextView מ-XML כדי שהאמוג'י יוצגו בצורה נכונה.

ההנחיה הזו רלוונטית אם אתם מרחיבים את ה-XML:

  • מחוץ ל-ComposeView, ב-Activity. שימו לב לשימוש ב-AppCompatActivity וב-TextView בקטע הקוד הבא:

class MyActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val emojiTextView: TextView = findViewById(R.id.emoji_text_view)
        emojiTextView.text = getString(R.string.emoji_text_view, EMOJI_TEXT)

        val composeView: ComposeView = findViewById(R.id.compose_view)

        composeView.apply {
            setContent {
                // compose code
            }
        }
    }
}
EmojiSnippets.kt

class MyActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContentView(
            ComposeView(this).apply {
                setContent {
                    Column {
                        Text(EMOJI_TEXT)

                        AndroidViewBinding(ExampleViewBinding::inflate) {
                            emojiTextView.text = EMOJI_TEXT
                        }
                    }
                }
            }
        )
    }
}
EmojiSnippets.kt

כדי להגדיל טקסט עם AndroidView בתוך ComposeView, משתמשים ב-AppCompatTextView כדי לעבד אמוג'י כמו שצריך:

class MyActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContentView(
            ComposeView(this).apply {
                setContent {
                    Column {
                        Text(EMOJI_TEXT)

                        AndroidView(
                            factory = { context -> AppCompatTextView(context) },
                            update = { it.text = EMOJI_TEXT }
                        )
                    }
                }
            }
        )
    }
}
EmojiSnippets.kt

פרטים נוספים זמינים במסמכים בנושא Interoperability APIs.

פתרון בעיות

אם מופיע טופו (☐) במקום האמוג'י, קודם צריך לבדוק אם הבעיה נובעת ממכשיר הבדיקה הספציפי. יש כמה דברים עיקריים שאפשר לבדוק: