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

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

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

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

דוגמאות לאמוג'י מודרני.

דוגמאות גרסה
🫩 🪉 🇨🇶 16.0 (ספטמבר 2024)
🐦‍🔥 🧑‍🧑‍🧒‍🧒 👩🏽‍🦽‍➡️ 🇲🇶 15.1 (ספטמבר 2023)
🩷 🫸🏼 🐦‍⬛ 15.0 (ספטמבר 2022)
🫠 🫱🏼‍🫲🏿 🫰🏽 14.0 (ספטמבר 2021)
😶‍🌫️ 🧔🏻‍♀️ 🧑🏿‍❤️‍🧑🏾 13.1 (ספטמבר 2020)
🥲 🥷🏿 🐻‍❄️ 13.0 (מרץ 2020)
🧑🏻‍🦰 🧑🏿‍🦯 👩🏻‍🤝‍👩🏼 12.1 (אוקטובר 2019)
🦩 🦻🏿 👩🏼‍🤝‍👩🏻 12.0 (פברואר 2019)

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

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

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

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

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

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

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

הארכה מ-ComponentActivity

אם המחלקה Activity מתרחבת מ-Compose 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
            }
        }
    }
}

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

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

הארכה מ-AppCompatActivity

אם Activity שלכם הוא הרחבה של AppCompatActivity, אתם יכולים להשתמש ב-ComposeView כדי לקרוא לפונקציות שאפשר להרכיב. כשמשתמשים ברכיבי Text composable, האמוג'י מוצגים בצורה תקינה בכל גרסאות 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
            }
        }
    }
}

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
                        }
                    }
                }
            }
        )
    }
}

כדי להוסיף 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 }
                        )
                    }
                }
            }
        )
    }
}

פרטים נוספים זמינים במסמכי התיעוד בנושא ממשקי API לשילוב עם מערכות אחרות.

פתרון בעיות

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