تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
إنّ "Gemini في استوديو Android" مجهّز بشكل فريد لمساعدتك في تحويل رؤيتك لواجهة مستخدم تطبيق Android إلى حقيقة، وذلك باستخدام Jetpack Compose واتّباع أفضل ممارسات Android.
توضّح هذه الصفحة الخطوات العامة لإنشاء واجهة مستخدم تطبيق باستخدام Gemini. لمزيد من المعلومات حول إرفاق الصور وأفكار أخرى حول كيفية استخدام هذه الميزة، يُرجى الاطّلاع على المقالة إرفاق صورة بطلب البحث.
لإنشاء واجهة مستخدم باستخدام Gemini، اتّبِع الخطوات العامة التالية:
أنشِئ نموذجًا تجريبيًا لواجهة مستخدم التطبيق التي تريدها. يُفضّل استخدام إطار شبكي أو تصميم أساسي. يمكنك تصدير ملف PNG من أداة تصميم أو حتى استخدام صورة مرسومة يدويًا.
أرفِق الصورة بطلب البحث من خلال النقر على إرفاق ملف صورة.
في حقل المحادثة، اطلب من Gemini إنشاء رمز واجهة المستخدم، مثلاً "أنشئ رمز Jetpack Compose للصورة المقدَّمة". عند إرسال طلب البحث والصورة، يقترح Gemini رمزًا برمجيًا لإنشاء واجهة المستخدم المقترَحة. يقدّم Gemini عادةً الرمز الخاص بمعاينة Compose أيضًا، ما يتيح لك تصور واجهة المستخدم بسرعة بعد استيرادها إلى مشروعك. وإذا لم يقدّم الرمز، يمكنك أن تطلب منه إنشاء معاينات Compose.
بعد استيراد الرمز والاطّلاع على معاينة Compose في لوحة المعاينة، يمكنك تكرار واجهة المستخدم من خلال النقر مباشرةً على المعاينة والطلب من Gemini تحويلها.
يخضع كل من المحتوى وعيّنات التعليمات البرمجية في هذه الصفحة للتراخيص الموضحّة في ترخيص استخدام المحتوى. إنّ Java وOpenJDK هما علامتان تجاريتان مسجَّلتان لشركة Oracle و/أو الشركات التابعة لها.
تاريخ التعديل الأخير: 2025-07-31 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","easyToUnderstand","thumb-up"],["ساعَدني المحتوى في حلّ مشكلتي.","solvedMyProblem","thumb-up"],["غير ذلك","otherUp","thumb-up"]],[["لا يحتوي على المعلومات التي أحتاج إليها.","missingTheInformationINeed","thumb-down"],["الخطوات معقدة للغاية / كثيرة جدًا.","tooComplicatedTooManySteps","thumb-down"],["المحتوى قديم.","outOfDate","thumb-down"],["ثمة مشكلة في الترجمة.","translationIssue","thumb-down"],["مشكلة في العيّنات / التعليمات البرمجية","samplesCodeIssue","thumb-down"],["غير ذلك","otherDown","thumb-down"]],["تاريخ التعديل الأخير: 2025-07-31 (حسب التوقيت العالمي المتفَّق عليه)"],[],[],null,["# Generate UI with image attachments\n\n| **Preview:** Enable image attachment through [Studio Labs](/studio/gemini/attach-image).\n| **Note:** Image attachment is currently available in Gemini's no-cost tier.\n\nGemini in Android Studio is uniquely equipped to help you make your Android app\nUI vision a reality, using Jetpack Compose and following Android best practices.\nThis page describes the general steps to creating an app UI with Gemini. For\nmore information about image attachment and other ideas for how to use the\nfeature, see [Attach an image to your query](/studio/gemini/attach-image).\n\nTo generate a UI with Gemini, follow these general steps:\n\n1. Create a mockup of the app UI that you want. A wireframe or basic design\n works best. You can export a PNG from a design tool or even use a hand drawn\n image.\n\n2. Attach the image to your query by clicking **Attach image file**\n .\n\n3. In the chat field, ask Gemini to generate the UI code, for example \"Generate\n Jetpack Compose code for the image provided.\" When you submit the query and\n image, Gemini suggests code to create the proposed UI. Gemini usually\n provides the code for the\n [Compose preview](/develop/ui/compose/tooling/previews) too, so you can\n quickly visualize the UI once you import the into your project---if it doesn't,\n ask it to\n [generate Compose the previews](/studio/gemini/generate-compose-previews).\n\n4. Once you import the code and can see the Compose preview in the preview\n panel, you can iterate on the UI by clicking directly on the preview and\n [asking Gemini to transform it](/studio/gemini/transform-ui)."]]
.
