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

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

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

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

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

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

لا يتطلّب هذا التوافق إجراء أي تغييرات على تطبيقك، فإذا كنت تستخدم Text وTextField (التصميم المتعدد الأبعاد 2 أو 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" الصحيح.