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

הסטנדרט של האמוג'י מתעדכן מדי שנה על ידי 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
        )/* ... */
    )
)
EmojiSnippets.kt

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

אם האפליקציה שלכם משתמשת גם ב-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
            }
        }
    }
}
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 כדי לקרוא לפונקציות קומפוזביליות. כשמשתמשים ברכיבי 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
            }
        }
    }
}
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

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

פתרון בעיות

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