یک برنامه پایه تاس غلتکی تعاملی ایجاد کنید

در این نرم افزار کد، شما یک برنامه اندرویدی Dice Roller ایجاد می کنید که کاربران می توانند روی Button ای در برنامه کلیک کنند تا تاس بیاندازند. نتیجه رول در یک TextView روی صفحه نمایش داده می شود.

شما از ویرایشگر Layout در اندروید استودیو برای ساخت طرح‌بندی برنامه خود استفاده می‌کنید و سپس کد Kotlin را برای آنچه که با کلیک روی Button اتفاق می‌افتد، بنویسید.

پیش نیازها

• نحوه ایجاد و اجرای "Hello, World!" برنامه در اندروید استودیو
• با استفاده از TextViews و ImageViews در یک برنامه آشنا هستید.
• نحوه تغییر ویژگی های TextView در ویرایشگر Layout .
• چگونه متن را در یک منبع رشته استخراج کنیم تا ترجمه برنامه و استفاده مجدد از رشته ها آسان تر شود.
• مبانی برنامه نویسی کاتلین همانطور که در کدهای قبلی آموزش داده شد.

چیزی که یاد خواهید گرفت

• نحوه اضافه کردن Button به برنامه اندروید
• نحوه اضافه کردن رفتار برای زمانی که یک Button در برنامه ضربه می زند.
• نحوه باز کردن و تغییر کد Activity یک برنامه
• نحوه نمایش پیام Toast
• نحوه به روز رسانی محتوای TextView در حین اجرای برنامه

چیزی که خواهی ساخت

• یک برنامه اندرویدی Dice Roller که دارای Button ای برای انداختن تاس است و متن روی صفحه را با نتیجه پرتاب به روز می کند.

آنچه شما نیاز دارید

• یک رایانه با Android Studio نصب شده است.

در اینجا این است که وقتی این نرم افزار کد را تکمیل کردید، برنامه چگونه به نظر می رسد.

پروژه Empty Activity ایجاد کنید

1. اگر قبلاً یک پروژه موجود در Android Studio باز کرده اید، به File > New > New Project... بروید تا صفحه Create New Project را باز کنید.
2. در Create New Project ، با استفاده از قالب Empty Activity یک پروژه Kotlin جدید ایجاد کنید.
3. برنامه را "Dice Roller" صدا کنید، با حداقل سطح API 19 (KitKat).

مهم: اگر با ایجاد یک پروژه جدید در Android Studio آشنا نیستید، برای جزئیات بیشتر به ایجاد و اجرای اولین برنامه اندروید خود مراجعه کنید.

4. برنامه جدید را اجرا کنید و باید شبیه این باشد.
   

Layout Editor را باز کنید

1. در پنجره Project ، روی activity_main.xml ( app > res > layout > activity_main.xml ) دوبار کلیک کنید تا باز شود. شما باید Layout Editor را ببینید و فقط TextView "Hello World" را در مرکز برنامه قرار دهید.
   

سپس یک Button به برنامه خود اضافه می کنید. Button یک عنصر رابط کاربری (UI) در اندروید است که کاربر می تواند برای انجام یک عمل روی آن ضربه بزند.

در این کار، یک Button در زیر TextView "Hello World" اضافه می کنید. TextView و Button در یک ConstraintLayout قرار خواهند گرفت که نوعی ViewGroup است.

هنگامی که Views در یک ViewGroup وجود دارد، View Views فرزندان ViewGroup والد در نظر گرفته می شوند. در مورد برنامه شما، TextView و Button فرزندان ConstraintLayout والدین در نظر گرفته می شوند.

به اضافه کردن یک Button به عنوان فرزند ConstraintLayout موجود در برنامه خود ادامه دهید.

توجه: مانند یک شجره نامه، در سلسله مراتب دیدگاه ، دیدگاه های والدین خود می توانند دیدگاه های فرزند باشند، و دیدگاه های فرزند می توانند والدین فرزندان دیگر باشند.

یک دکمه به طرح اضافه کنید

1. یک Button را از پالت به نمای طراحی بکشید و آن را در زیر TextView "Hello World" قرار دهید.
   
2. در زیر پالت در درخت کامپوننت ، بررسی کنید که Button و TextView در زیر ConstraintLayout (به عنوان فرزندان ConstraintLayout ) فهرست شده باشند.
3. به یک خطا توجه کنید که Button محدود نیست. از آنجایی که Button در یک ConstraintLayout قرار دارد، باید محدودیت های عمودی و افقی را برای قرار دادن آن تنظیم کنید.

دکمه را قرار دهید

در این مرحله یک محدودیت عمودی از بالای Button به پایین TextView اضافه می‌کنید. این Button را در زیر TextView قرار می دهد.

1. در نمای طراحی ، در لبه بالای Button ، دایره سفید با حاشیه آبی را فشار داده و نگه دارید. نشانگر را بکشید و یک فلش به دنبال نشانگر خواهد آمد. وقتی به لبه پایینی «Hello World» TextView ، آن را آزاد کنید. این یک محدودیت طرح‌بندی را ایجاد می‌کند، و Button تا زیر TextView به بالا می‌لغزد.
   
2. به ویژگی ها در سمت راست Layout Editor نگاه کنید.
3. در ابزارک محدودیت، به یک محدودیت طرح‌بندی جدید توجه کنید که در پایین TextView ، Top → BottomOf textView (0dp) تنظیم شده است. (0dp) به این معنی است که یک حاشیه 0 وجود دارد. شما همچنین یک خطا برای از دست دادن محدودیت های افقی دارید.
   
4. یک محدودیت افقی از سمت چپ Button به سمت چپ ConstraintLayout والد اضافه کنید.
5. این کار را در سمت راست تکرار کنید، لبه سمت راست Button را به لبه سمت راست ConstraintLayout متصل کنید. نتیجه باید به این صورت باشد:

6. در حالی که Button هنوز انتخاب شده است، ویجت محدودیت باید به این شکل باشد. به دو محدودیت اضافی که اضافه شده‌اند توجه کنید: Start → StartOf parent (0dp) و End → EndOf parent (0dp) . این بدان معناست که Button به صورت افقی در مرکز اصلی خود، ConstraintLayout قرار دارد.
   

7. برنامه را اجرا کنید. باید مانند تصویر زیر باشد. می توانید روی Button کلیک کنید، اما هنوز کاری انجام نمی دهد. بیا ادامه بدیم!

متن دکمه را تغییر دهید

می‌خواهید چند تغییر رابط کاربری دیگر در ویرایشگر طرح‌بندی ایجاد کنید.

به جای اینکه برچسب Button "دکمه" را نشان دهد، آن را به چیزی تغییر دهید که نشان می دهد دکمه قرار است چه کاری انجام دهد: "Roll".

1. در Layout Editor ، با انتخاب Button ، به Attributes بروید، متن را به Roll تغییر دهید و کلید Enter ( Return on Mac) را فشار دهید.

2. در Component Tree یک مثلث هشدار نارنجی در کنار Button ظاهر می شود. اگر نشانگر را روی مثلث نگه دارید، پیامی ظاهر می شود. Android Studio یک رشته کد سخت ("Roll") را در کد برنامه شما شناسایی کرده است و پیشنهاد می کند به جای آن از یک منبع رشته استفاده کنید.

داشتن یک رشته کد سخت به این معنی است که ترجمه برنامه به زبان های دیگر دشوارتر خواهد بود و استفاده مجدد از رشته ها در بخش های مختلف برنامه شما دشوارتر است. خوشبختانه اندروید استودیو یک تعمیر خودکار برای شما دارد.

3. در Component Tree، روی مثلث نارنجی کلیک کنید.

پیام هشدار کامل باز می شود.

4. در پایین پیام، در قسمت پیشنهادی اصلاح ، روی دکمه رفع کلیک کنید. (شاید لازم باشد به پایین پیمایش کنید.)
5. گفتگوی Extract Resource باز می شود. استخراج یک رشته به معنای برداشتن متن "Roll" و ایجاد منبع رشته ای به نام roll در strings.xml است ( app > res > values ​​> strings.xml ). مقادیر پیش‌فرض صحیح هستند، بنابراین روی OK کلیک کنید.

6. توجه داشته باشید که در ویژگی‌ها ، ویژگی text برای Button اکنون با اشاره به منبعی که ایجاد کرده‌اید، @string/roll می‌گوید.
   

در نمای طراحی ، Button همچنان باید روی آن نوشته شود.

به TextView استایل دهید

"سلام جهان!" متن بسیار کوچک است و پیام مربوط به برنامه شما نیست. در این مرحله شما جایگزین کوچک "Hello, World!" با یک عدد پیام دهید تا مقدار رول شده را نشان دهد و فونت را بزرگ‌تر کند تا راحت‌تر دیده شود.

1. در ویرایشگر طراحی ، TextView را انتخاب کنید تا ویژگی های آن در پنجره Attributes ظاهر شود.
2. اندازه متن TextView را به 36sp تغییر دهید تا بزرگ و آسان برای خواندن باشد. ممکن است لازم باشد برای یافتن textSize پیمایش کنید.

3. ویژگی متن TextView را پاک کنید. تا زمانی که کاربر تاس نریزد، نیازی به نمایش چیزی در TextView ندارید.

با این حال، هنگامی که در حال ویرایش طرح‌بندی و کد برنامه خود هستید، دیدن مقداری متن در TextView بسیار مفید است. برای این منظور، می‌توانید متنی را به TextView اضافه کنید که فقط برای پیش‌نمایش طرح‌بندی قابل مشاهده است، اما نه زمانی که برنامه در حال اجرا است.

.

4. TextView را در درخت Component انتخاب کنید.
5. در قسمت Common Attributes ، ویژگی text و در زیر آن، یک ویژگی متن دیگر با نماد ابزار را پیدا کنید. ویژگی متن چیزی است که هنگام اجرای برنامه به کاربر نمایش داده می شود. ویژگی متن با نماد ابزار، ویژگی "متن ابزار" است که فقط برای شما به عنوان یک توسعه دهنده است.
6. متن ابزارها را در TextView روی "1" تنظیم کنید (برای اینکه وانمود کنید که یک تاس ریخته شده دارید). "1" فقط در ویرایشگر طراحی اندروید استودیو ظاهر می شود، اما زمانی که برنامه را روی دستگاه یا شبیه ساز واقعی اجرا می کنید ظاهر نمی شود.

توجه داشته باشید که از آنجایی که این متن فقط توسط توسعه دهندگان برنامه مشاهده می شود، نیازی به ایجاد یک منبع رشته ای برای آن ندارید.

7. به برنامه خود در پیش نمایش نگاه کنید. "1" نشان داده می شود.

8. برنامه خود را اجرا کنید این همان چیزی است که برنامه زمانی که روی یک شبیه ساز اجرا می شود به نظر می رسد. "1" نشان داده نمی شود. این رفتار صحیح است.

عالی است، شما با تغییرات طرح تمام شده اید!

شما یک برنامه با یک دکمه دارید، اما اگر روی دکمه ضربه بزنید، هیچ اتفاقی نمی افتد. برای تغییر این حالت، باید مقداری کد Kotlin بنویسید که تاس می اندازد و با ضربه زدن روی دکمه صفحه را به روز می کند.

برای ایجاد این تغییر، باید کمی بیشتر از نحوه ساختار یک برنامه اندروید بدانید.

یک Activity پنجره ای را ارائه می دهد که برنامه شما رابط کاربری خود را در آن ترسیم می کند. به طور معمول، یک Activity کل صفحه برنامه در حال اجرا شما را اشغال می کند. هر برنامه یک یا چند فعالیت دارد. فعالیت سطح بالا یا اولین اغلب MainActivity نامیده می شود و توسط الگوی پروژه ارائه می شود. به عنوان مثال، هنگامی که کاربر در لیست برنامه های موجود در دستگاه خود پیمایش می کند و روی نماد برنامه "Dice Roller" ضربه می زند، سیستم Android MainActivity برنامه را راه اندازی می کند.

در کد MainActivity خود، باید جزئیاتی در مورد طرح‌بندی Activity و نحوه تعامل کاربر با آن ارائه دهید.

• در برنامه کارت تولد، یک Activity وجود دارد که پیام و تصویر تولد را نمایش می دهد.
• در برنامه Dice Roller، یک Activity وجود دارد که طرح TextView و Button را که به تازگی ساخته اید نمایش می دهد.

برای برنامه‌های پیچیده‌تر، ممکن است چندین صفحه و بیش از یک Activity وجود داشته باشد. هر Activity هدف خاصی دارد.

به عنوان مثال، در یک برنامه گالری عکس، می‌توانید یک Activity برای نمایش شبکه‌ای از عکس‌ها، یک Activity دوم برای مشاهده یک عکس جداگانه و یک Activity سوم برای ویرایش یک عکس جداگانه داشته باشید.

فایل MainActivity.kt را باز کنید

برای پاسخ به ضربه زدن دکمه در MainActivity کدی را اضافه خواهید کرد. برای اینکه این کار را به درستی انجام دهید، باید درباره کد MainActivity که از قبل در برنامه شما وجود دارد بیشتر بدانید.

1. به فایل MainActivity.kt بروید و آن را باز کنید ( app > java > com.example.diceroller > MainActivity.kt ). در زیر چیزی است که باید ببینید. اگر import... را مشاهده کردید، روی ... کلیک کنید تا واردات گسترش یابد.

package com.example.diceroller

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle

class MainActivity : AppCompatActivity() {

   override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
       setContentView(R.layout.activity_main)
   }
}

شما نیازی به درک تک تک کلمات کد بالا ندارید، اما باید یک ایده کلی از آنچه انجام می دهد داشته باشید. هرچه بیشتر با کد اندروید کار کنید، بیشتر آشنا خواهید شد و بیشتر آن را درک خواهید کرد.

2. به کد Kotlin برای کلاس MainActivity نگاه کنید که با class کلمه کلیدی و سپس نام مشخص می شود.

class MainActivity : AppCompatActivity() {
    ...
}

3. توجه داشته باشید که هیچ تابع main() در MainActivity شما وجود ندارد.
   
   قبلاً یاد گرفتید که هر برنامه Kotlin باید تابع main() داشته باشد. برنامه های اندرویدی متفاوت عمل می کنند. به جای فراخوانی تابع main() main، سیستم اندروید زمانی که برنامه شما برای اولین بار باز می شود، onCreate() MainActivity شما را فراخوانی می کند.
   
4. onCreate() را پیدا کنید که شبیه کد زیر است.

   override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
       setContentView(R.layout.activity_main)
   }

شما در مورد override در یک Codelab بعدی یاد خواهید گرفت (پس فعلاً نگران آن نباشید). بقیه روش onCreate() MainActivity را با استفاده از کدهای وارد شده و با تنظیم طرح اولیه با setContentView() تنظیم می کند.

5. به خطوطی که با import شروع می شوند توجه کنید.
   

اندروید چارچوبی از کلاس‌های متعدد را برای آسان‌تر کردن نوشتن برنامه‌های اندروید ارائه می‌کند، اما باید دقیقاً بداند که منظور شما کدام کلاس است. می توانید با استفاده از دستور import مشخص کنید که کدام کلاس در فریم ورک در کد خود استفاده شود. برای مثال، کلاس Button در android.widget.Button تعریف شده است.

فعال کردن واردات خودکار

وقتی از کلاس‌های بیشتری استفاده می‌کنید، یادآوری اضافه کردن import می‌تواند کار زیادی باشد. خوشبختانه، Android Studio به شما کمک می کند تا زمانی که از کلاس های ارائه شده توسط دیگران استفاده می کنید، واردات صحیح را انتخاب کنید. در این مرحله اندروید استودیو را به گونه‌ای پیکربندی می‌کنید که در صورت امکان، به‌طور خودکار واردات اضافه کند و به‌طور خودکار واردات بلااستفاده را از کد شما حذف کند.

1. در Android Studio، تنظیمات را با رفتن به File > Other Settings > Preferences for New Projects باز کنید.
2. تنظیمات دیگر > وارد کردن خودکار را باز کنید. در بخش جاوا و کاتلین ، مطمئن شوید که Add unambiguous imports on the fly و Optimize imports on the fly (برای پروژه فعلی) علامت زده شده است. توجه داشته باشید که در هر بخش دو چک باکس وجود دارد.
   
   تنظیمات واردات بدون ابهام به اندروید استودیو می‌گویند که به‌طور خودکار یک عبارت import اضافه کند، تا زمانی که بتواند تعیین کند از کدام یک استفاده کند. تنظیمات بهینه‌سازی واردات به Android Studio می‌گوید هر گونه وارداتی را که توسط کد شما استفاده نمی‌شود حذف کند.
   
3. تغییرات را ذخیره کنید و تنظیمات را با فشار دادن OK ببندید.

اکنون که کمی بیشتر در مورد MainActivity می‌دانید، برنامه را طوری تغییر می‌دهید که با کلیک کردن روی Button ، کاری روی صفحه انجام شود.

با کلیک روی دکمه، پیامی نمایش داده شود

در این مرحله مشخص می کنید که با کلیک روی دکمه، یک پیام کوتاه در پایین صفحه نمایش داده شود.

1. پس از فراخوانی setContentView() کد زیر را به onCreate() اضافه کنید. متد findViewById() Button را در طرح پیدا می کند. R.id.button شناسه منبع برای Button است که یک شناسه منحصر به فرد برای آن است. کد یک مرجع به شی Button را در متغیری به نام rollButton می کند، نه خود شی Button .

val rollButton: Button = findViewById(R.id.button)

توجه: Android به‌طور خودکار شماره‌های شناسایی را به منابع موجود در برنامه شما اختصاص می‌دهد. به عنوان مثال، دکمه Roll یک شناسه منبع دارد و رشته متن دکمه نیز دارای شناسه منبع است. شناسه های منبع به شکل R.<type>.<name> ; برای مثال، R.string.roll . برای View شناسه ها، <type> id است، به عنوان مثال، R.id.button

کد مرجع را به شی Button در متغیری به نام rollButton می کند، نه خود شی Button .

مهم: هنگامی که یک شی را به یک متغیر اختصاص می دهد، کاتلین هر بار کل شی را کپی نمی کند، بلکه یک مرجع را به شی ذخیره می کند. شما می توانید یک مرجع را مانند شماره تامین اجتماعی یا شماره شناسه ملی دیگر در نظر بگیرید: شماره به یک شخص اشاره دارد، اما خود شخص نیست. وقتی شماره را کپی می کنید، آن شخص را کپی نمی کنید.

onCreate() اکنون باید شبیه این باشد.

override fun onCreate(savedInstanceState: Bundle?) {
   super.onCreate(savedInstanceState)
   setContentView(R.layout.activity_main)

   val rollButton: Button = findViewById(R.id.button)
}

2. بررسی کنید که Android Studio به طور خودکار یک عبارت import برای Button اضافه کرده باشد.
   توجه داشته باشید که اکنون 3 عبارت واردات وجود دارد - مورد سوم به طور خودکار اضافه شد.
   

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button

توجه: اگر فعال کردن واردات خودکار کار نکرد، Button با رنگ قرمز برجسته می شود. می‌توانید با قرار دادن مکان‌نمای متن در کلمه Button و سپس فشار دادن Alt+Enter ( Option+Enter در مک) وارد کردن صحیح را به صورت دستی اضافه کنید.

در مرحله بعد باید کد را با Button مرتبط کنید تا با ضربه زدن روی Button ، کد اجرا شود. شنونده کلیک کدی است برای اینکه وقتی ضربه یا کلیک اتفاق می افتد چه کاری باید انجام دهید. می‌توانید آن را به‌عنوان کدی در نظر بگیرید که فقط نشسته است، «گوش می‌کند» تا کاربر روی Button کلیک کند، در این مورد.

3. از شی rollButton استفاده کنید و با فراخوانی setOnClickListener() روی آن یک کلیک شنونده تنظیم کنید.

rollButton.setOnClickListener {
}

همانطور که تایپ می کنید، Android Studio ممکن است چندین پیشنهاد را نشان دهد. برای این مورد، گزینه setOnClickListener {...} را انتخاب کنید.

در بریس‌های فرفری، دستورالعمل‌هایی را قرار می‌دهید که با زدن دکمه چه اتفاقی می‌افتد. در حال حاضر، برنامه شما یک Toast را نمایش می دهد که پیام کوتاهی است که برای کاربر ظاهر می شود.

4. یک Toast با متن "Dice Rolled!" با فراخوانی Toast.makeText() .

val toast = Toast.makeText(this, "Dice Rolled!", Toast.LENGTH_SHORT)

5. سپس به Toast بگویید با فراخوانی متد show() خود را نشان دهد.

toast.show()

کلاس MainActivity به روز شده شما به این شکل است. دستورات package و import همچنان در بالای فایل هستند:

class MainActivity : AppCompatActivity() {

   override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
       setContentView(R.layout.activity_main)

       val rollButton: Button = findViewById(R.id.button)
       rollButton.setOnClickListener {
           val toast = Toast.makeText(this, "Dice Rolled!", Toast.LENGTH_SHORT)
           toast.show()
       }
   }
}

می توانید دو خط را در شنونده کلیک در یک خط بدون متغیر ترکیب کنید. این یک الگوی رایج است که ممکن است در کدهای دیگر پیدا کنید.

Toast.makeText(this, "Dice Rolled!", Toast.LENGTH_SHORT).show()

6. برنامه را اجرا کنید و روی دکمه Roll کلیک کنید. یک پیام نان تست باید در پایین صفحه ظاهر شود و پس از مدت کوتاهی ناپدید شود.

هورا! کلیک روی دکمه باعث شد پیام ظاهر شود! این اولین باری است که کد کاتلین برای اندروید می نویسید!

با کلیک روی دکمه TextView را به روز کنید

به‌جای نمایش یک پیام Toast موقت، وقتی روی دکمه Roll کلیک می‌شود، کدی برای به‌روزرسانی TextView روی صفحه می‌نویسید.

1. بازگشت به activity_main.xml ( app > res > layout >activity_main.xml )
2. روی TextView کلیک کنید.
3. توجه داشته باشید که شناسه textView است.
   
4. MainActivity.kt باز کنید ( app > java > com.example.diceroller > MainActivity.kt )
5. خطوط کدی را که Toast را ایجاد کرده و نشان می دهد حذف کنید.

rollButton.setOnClickListener {
  
}

6. به جای آنها، یک متغیر جدید به نام resultTextView برای ذخیره TextView ایجاد کنید.
7. از findViewById() برای یافتن textView در طرح با استفاده از شناسه آن استفاده کنید و یک مرجع به آن ذخیره کنید.

val resultTextView: TextView = findViewById(R.id.textView)

8. متن را در resultTextView روی «6» در نقل قول تنظیم کنید.
   

resultTextView.text = "6"

این شبیه کاری است که با تنظیم متن در Attributes انجام دادید، اما اکنون در کد شما قرار دارد، بنابراین متن باید در داخل دو علامت نقل قول قرار گیرد. تنظیم این به صراحت به این معنی است که در حال حاضر، TextView همیشه 6 را نمایش می دهد. شما کدی را برای ریختن تاس اضافه می کنید و مقادیر مختلف را در کار بعدی نشان می دهید.

کلاس MainActivity باید به این صورت باشد:

class MainActivity : AppCompatActivity() {

   override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
       setContentView(R.layout.activity_main)

       val rollButton: Button = findViewById(R.id.button)
       rollButton.setOnClickListener {
           val resultTextView: TextView = findViewById(R.id.textView)
           resultTextView.text = "6"
       }
   }
}

9. برنامه را اجرا کنید. روی دکمه کلیک کنید. باید TextView را به "6" به روز کند.

تنها چیزی که کم است انداختن تاس است. می‌توانید از کلاس Dice از کدهای قبلی استفاده کنید، که منطق تاس انداختن را مدیریت می‌کند.

کلاس Dice را اضافه کنید

1. بعد از آخرین بریس فرفری در کلاس MainActivity ، کلاس Dice را با متد roll() ایجاد کنید.

class Dice(val numSides: Int) {

   fun roll(): Int {
       return (1..numSides).random()
   }
}

2. توجه داشته باشید که Android Studio زیر numSides با یک خط خاکستری مواج خط کشیده است. (ممکن است یک لحظه ظاهر شود.)
3. نشانگر خود را روی numSides ، و یک پنجره بازشو ظاهر می شود که می گوید Property 'numSides' می تواند خصوصی باشد.
   

علامت گذاری numSides به عنوان private باعث می شود که فقط در کلاس Dice قابل دسترسی باشد. از آنجایی که تنها کدی که از numSides استفاده می کند در کلاس Dice است، اشکالی ندارد که این آرگومان را برای کلاس Dice private کنید. در بخش بعدی درباره متغیرهای private در مقابل public بیشتر خواهید آموخت.

4. ادامه دهید و با کلیک روی «numSides» «خصوصی»، اصلاح پیشنهادی را از Android Studio انجام دهید.

یک متد rollDice() ایجاد کنید

اکنون که کلاس Dice را به برنامه خود اضافه کرده اید، MainActivity را برای استفاده از آن به روز می کنید. برای سازماندهی بهتر کد خود، تمام منطق تاس انداختن را در یک تابع قرار دهید.

1. کد را در شنونده کلیک که متن را روی "6" تنظیم می کند با فراخوانی به rollDice() کنید.

rollButton.setOnClickListener {
   rollDice()
}

2. از آنجایی که rollDice() هنوز تعریف نشده است، Android Studio یک خطا را پرچم گذاری کرده و rollDice() را به رنگ قرمز نشان می دهد.
3. اگر نشانگر خود را روی rollDice() قرار دهید، Android Studio مشکل و برخی راه حل های ممکن را نمایش می دهد.

4. روی More actions... کلیک کنید تا منوی ظاهر شود. Android Studio پیشنهاد می کند که کارهای بیشتری را برای شما انجام دهد!

نکته: اگر برایتان مشکل است که نشانگر را نگه دارید و سپس روی More actions کلیک کنید... می توانید روی rollDice() کلیک کنید و Alt+Enter ( Option+Enter در Mac) را فشار دهید تا منو ظاهر شود.

5. ایجاد تابع 'rollDice' را انتخاب کنید. Android Studio یک تعریف خالی برای تابع درون MainActivity ایجاد می کند.

private fun rollDice() {
    TODO("Not yet implemented")
}

یک نمونه شی جدید Dice ایجاد کنید

در این مرحله، rollDice() را ایجاد می‌کنید و تاس می‌اندازید و سپس نتیجه را در TextView نمایش می‌دهید.

1. در داخل rollDice() ، فراخوانی TODO() را حذف کنید.
2. برای ایجاد یک تاس با 6 ضلع کد اضافه کنید.

val dice = Dice(6)

3. با فراخوانی متد roll() تاس بیندازید و نتیجه را در متغیری به نام diceRoll کنید.

val diceRoll = dice.roll()

4. TextView را با فراخوانی findViewById() بیابید.

val resultTextView: TextView = findViewById(R.id.textView)

متغیر diceRoll یک عدد است، اما TextView از متن استفاده می کند. می توانید از toString() در diceRoll برای تبدیل آن به رشته استفاده کنید.

5. diceRoll را به رشته ای تبدیل کنید و از آن برای به روز رسانی متن resultTextView استفاده کنید.

resultTextView.text = diceRoll.toString()

rollDice() به این صورت است:

private fun rollDice() {
    val dice = Dice(6)
    val diceRoll = dice.roll()
    val resultTextView: TextView = findViewById(R.id.textView)
    resultTextView.text = diceRoll.toString()
}

6. برنامه خود را اجرا کنید نتیجه تاس باید به مقادیر دیگری غیر از 6 تغییر کند! از آنجایی که یک عدد تصادفی از 1 تا 6 است، مقدار 6 ممکن است گاهی اوقات نیز ظاهر شود.

هورا، تو راک!

طبیعی است که کد شما پس از اینکه بخش‌هایی را اینجا و آنجا بهینه می‌کنید تا برنامه‌تان کار کند، کمی آشفته به نظر برسد. اما قبل از اینکه از کد خود دور شوید، باید چند کار پاکسازی آسان انجام دهید. سپس برنامه در وضعیت خوبی قرار می گیرد و حفظ آن در آینده آسان تر خواهد بود.

این عادات همان چیزی است که توسعه دهندگان حرفه ای اندروید هنگام نوشتن کد خود انجام می دهند.

راهنمای سبک اندروید

همانطور که روی تیم‌ها کار می‌کنید، برای اعضای تیم ایده‌آل است که کد را به روشی مشابه بنویسند، بنابراین یکنواختی در کد وجود دارد. به همین دلیل است که Android یک راهنمای سبک برای نحوه نوشتن کد اندروید دارد - قراردادهای نامگذاری، قالب‌بندی و سایر روش‌های خوب که باید دنبال کنید. هنگام نوشتن کد Android از این دستورالعمل ها پیروی کنید: راهنمای سبک Kotlin برای توسعه دهندگان Android .

در زیر چند روش وجود دارد که می توانید به راهنمای سبک پایبند باشید.

کد خود را پاک کنید

کد خود را متراکم کنید

می توانید کد خود را با متراکم کردن کد در تعداد خطوط کوتاه تر مختصرتر کنید. به عنوان مثال، در اینجا کدی است که شنونده کلیک را روی Button تنظیم می کند.

rollButton.setOnClickListener {
    rollDice()
}

از آنجایی که دستورالعمل های مربوط به کلیک شنونده تنها 1 خط طول دارند، می توانید فراخوانی متد rollDice() و بریس های فرفری را روی یک خط متراکم کنید. این چیزی است که به نظر می رسد. یک خط به جای سه خط!

rollButton.setOnClickListener { rollDice() }

کد خود را دوباره فرمت کنید

اکنون کد خود را مجدداً فرمت می‌کنید تا مطمئن شوید که از قراردادهای قالب‌بندی کد پیشنهادی برای Android پیروی می‌کند.

1. در کلاس MainActivity.kt ، تمام متن فایل را با میانبر صفحه کلید Control+A در ویندوز (یا Command+A در مک) انتخاب کنید. یا می توانید به منوی Android Studio Edit > Select All بروید.
2. با تمام متن انتخاب شده در فایل، به منوی Android Studio Code > Reformat Code بروید یا از میانبر صفحه کلید Ctrl+Alt+L (یا Command+Option+L در مک) استفاده کنید.

که قالب بندی کد شما را به روز می کند که شامل فضای خالی، تورفتگی و موارد دیگر می شود. ممکن است هیچ تغییری نبینید و این خوب است. کد شما قبلاً به درستی فرمت شده بود!

کد خود را کامنت کنید

برای توضیح آنچه در کدی که نوشته‌اید اتفاق می‌افتد، چند نظر به کد خود اضافه کنید. همانطور که کد پیچیده تر می شود، همچنین مهم است که به این نکته توجه داشته باشید که چرا کد را طوری نوشته اید که به روشی که انجام داده اید کار کند. اگر بعداً برای ایجاد تغییرات به کد بازگردید، کاری که کد انجام می‌دهد ممکن است هنوز واضح باشد، اما ممکن است به خاطر نداشته باشید که چرا آن را به روشی که انجام داده‌اید نوشته‌اید.

معمولاً برای هر کلاس نظر اضافه می شود ( MainActivity و Dice تنها کلاس هایی هستند که در برنامه خود دارید) و هر روشی که می نویسید. از علامت های / /** و **/ در ابتدا و انتهای نظر خود استفاده کنید تا به سیستم بگویید که این کد نیست. هنگامی که سیستم کد شما را اجرا می کند، این خطوط نادیده گرفته می شوند.

نمونه ای از نظر در یک کلاس:

/**
* This activity allows the user to roll a dice and view the result
* on the screen.
*/
class MainActivity : AppCompatActivity() {

نمونه ای از اظهار نظر در مورد یک روش:

/**
* Roll the dice and update the screen with the result.
*/
private fun rollDice() {

در یک روش، اگر به خواننده کد شما کمک می کند، می توانید نظرات خود را اضافه کنید. به یاد داشته باشید که می توانید از نماد // در ابتدای نظر خود استفاده کنید. هر چیزی که بعد از علامت // روی یک خط قرار می گیرد، یک نظر در نظر گرفته می شود.

مثالی از 2 نظر در یک متد:

private fun rollDice() {
   // Create new Dice object with 6 sides and roll it
   val dice = Dice(6)
   val diceRoll = dice.roll()

   // Update the screen with the dice roll
   val resultTextView: TextView = findViewById(R.id.textView)
   resultTextView.text = diceRoll.toString()
}

1. ادامه دهید و کمی زمان بگذارید تا نظرات خود را به کد خود اضافه کنید.
2. با همه این تغییرات در نظر دادن و قالب بندی، تمرین خوبی است که برنامه خود را دوباره اجرا کنید تا مطمئن شوید که همچنان همانطور که انتظار می رود کار می کند.

کد راه حل را برای یکی از راه هایی که می توانستید روی کد خود نظر دهید، ببینید.

کد راه حل برای این کد لبه در پروژه و ماژول نشان داده شده در زیر است.

آدرس کد راه حل: https://github.com/google-developer-training/android-basics-kotlin-create-dice-roller-with-button-app-solution

برای دریافت کد این کد لبه از گیت هاب و باز کردن آن در اندروید استودیو، موارد زیر را انجام دهید.

1. اندروید استودیو را راه اندازی کنید.
2. در پنجره خوش آمدید به Android Studio ، روی بررسی پروژه از کنترل نسخه کلیک کنید.
3. Git را انتخاب کنید.

4. در گفتگوی Clone Repository ، URL کد ارائه شده را در کادر URL قرار دهید.
5. روی دکمه Test کلیک کنید، منتظر بمانید و مطمئن شوید که یک حباب بازشو سبز وجود دارد که می گوید اتصال موفقیت آمیز است.
6. به صورت اختیاری، دایرکتوری را به چیزی متفاوت از پیش فرض پیشنهادی تغییر دهید.

7. روی Clone کلیک کنید. Android Studio شروع به واکشی کد شما می کند.
8. در پنجره بازشو Checkout from Version Control ، روی Yes کلیک کنید.

9. منتظر بمانید تا Android Studio باز شود.
10. ماژول صحیح را برای راه‌انداز یا کد راه‌حل Codelab خود انتخاب کنید.

11. روی دکمه Run کلیک کنید برای ساخت و اجرای کد شما

راهنما: اگر کد دانلود شده شما به درستی بارگیری یا اجرا نمی شود، راهنمای عیب یابی و راهنما را ببینید.

• با استفاده از Layout Editor یک Button در برنامه Android اضافه کنید.
• کلاس MainActivity.kt را تغییر دهید تا رفتار تعاملی را به برنامه اضافه کنید.
• یک پیام Toast را به عنوان یک راه حل موقت برای تأیید اینکه در مسیر درست هستید، باز کنید.
• با استفاده از setOnClickListener() یک شنونده روی کلیک را برای یک Button تنظیم کنید تا رفتاری را برای زمانی که روی Button کلیک می شود اضافه کنید.
• وقتی برنامه در حال اجرا است، می‌توانید با فراخوانی روش‌هایی روی TextView ، Button یا سایر عناصر رابط کاربری موجود در طرح‌بندی، صفحه را به‌روزرسانی کنید.
• کد خود را کامنت کنید تا به افرادی که در حال خواندن کد شما هستند کمک کنید تا بفهمند رویکرد شما چه بوده است.
• کد خود را دوباره فرمت کنید و کد خود را پاک کنید.

• کلاس Button
• کلاس Toast
• کلاس TextView
• راهنمای سبک Kotlin برای توسعه دهندگان اندروید

توجه: تمرینات اختیاری است. آنها فرصتی را برای شما فراهم می کنند تا آنچه را که در این نرم افزار یاد گرفته اید تمرین کنید.

موارد زیر را انجام دهید:

1. تاس دیگری را به برنامه اضافه کنید. با کلیک بر روی دکمه Roll باید 2 تاس ریخته شود. نتایج باید در 2 TextViews مختلف روی صفحه نمایش داده شوند.

کارتو چک کن:

برنامه تمام شده شما باید بدون خطا اجرا شود و دو تاس را در برنامه نشان دهد.