عرض الرموز التعبيرية

يتم تحديث مجموعة رموز الإيموجي العادية سنويًا من قِبل يونيكود، وذلك لأنّ استخدام رموز الإيموجي يتزايد بسرعة في جميع أنواع التطبيقات.

إذا كان تطبيقك يعرض محتوًى من الإنترنت أو يتيح إدخال نص، ننصحك بشدة بإتاحة استخدام أحدث خطوط الرموز التعبيرية. في ما عدا ذلك، قد يتم عرض الرموز التعبيرية الأحدث على شكل مربّع صغير يُعرف باسم التوفو (☐) أو تسلسلات رموز تعبيرية أخرى معروضة بشكل غير صحيح.

لا يمكن تحديث خط الرموز التعبيرية في الإصدارات 11 (المستوى 30 لواجهة برمجة التطبيقات) والإصدارات الأقدم من نظام التشغيل Android، لذا يجب تحديث التطبيقات التي تعرض الرموز التعبيرية على هذه الإصدارات يدويًا.

في ما يلي أمثلة على الرموز التعبيرية الحديثة.

يتيح الإصدار التجريبي من BOM لشهر مارس 2023 (الإصدار 1.4 من واجهة مستخدم Compose) استخدام أحدث إصدار من الرموز التعبيرية، بما في ذلك التوافق مع الإصدارات القديمة من Android حتى المستوى 21 لواجهة برمجة التطبيقات.

لا يتطلّب هذا التوافق إجراء أي تغييرات على تطبيقك، فإذا كنت تستخدم Text وTextField (Material 2 أو Material 3) أو BasicText وBasicTextField، سيتوفّر لك تلقائيًا دعم الرموز التعبيرية الحديثة.

أفضل طريقة لاختبار أحدث الرموز التعبيرية في تطبيقك هي استخدام جهاز حقيقي يعمل بالإصدار 30 أو إصدار أقدم من واجهة برمجة التطبيقات.

إذا كنت تستخدم حلاً مخصّصًا للرموز التعبيرية أو كنت بحاجة إلى إيقاف دقة الرموز التعبيرية التلقائية في Compose لأي سبب آخر، يمكنك استخدام PlatformTextStyle(emojiSupportMatch):

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

إمكانية التشغيل التفاعلي

إذا كان تطبيقك يستخدم كلاً من Views وCompose في Activity نفسه، تأكَّد من استخدام واجهات برمجة التطبيقات المناسبة لإعداد رموز الإيموجي بشكل صحيح. توضّح الأقسام التالية الحالات التي يجب فيها استخدام كل واجهة برمجة تطبيقات.

التمديد من 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 لاستدعاء الدوال البرمجية القابلة للإنشاء. يتم عرض رموز الإيموجي بشكل صحيح على جميع إصدارات Android عند استخدام عناصر Text القابلة للإنشاء.

إذا كنت تستخدم 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

• داخل ComposeView، من خلال ربط العرض باستخدام AndroidViewBinding، كما هو موضّح في المقتطف التالي:

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

لمزيد من التفاصيل، يُرجى الاطّلاع على مستندات واجهات برمجة التطبيقات الخاصة بإمكانية التشغيل التفاعلي.

تحديد المشاكل وحلّها

إذا ظهرت لك مربعات (☐) بدلاً من الرموز التعبيرية، تحقّق أولاً مما إذا كانت المشكلة في جهاز الاختبار المحدّد. في ما يلي بعض الأمور الرئيسية التي يمكنك التحقّق منها:

• قد تستخدم جهازًا تم تحديثه مؤخرًا أو محاكيًا جديدًا. إذا أمكن، جرِّب جهازًا اختباريًا حقيقيًا آخر تستخدمه كثيرًا وتم تسجيل الدخول إليه باستخدام حساب Google. يُرجى العِلم أنّ مستوى واجهة برمجة التطبيقات يجب أن يكون 30 أو أقل لضمان عمل الرموز التعبيرية في الإصدارات الصحيحة.
• لا يتيح الهاتف التجريبي استخدام الخطوط القابلة للتنزيل.
• تحقَّق من إصدار "خدمات Google Play" الصحيح.