آکادمی آموزش آنلاین طوسی

آشنایی با ScrollView در اندروید

هداف آموزشی این درس:

1.معرفی ScrollView 

2. نحوه شفاف سازی پس زمینه یک دکمه در اندروید

در ادامه آموزش قبل، در این آموزش قصد داریم به اپ خود قابلیت ScrollView را اضافه نماییم. به طور کلی از ScrollView زمانی استفاده می کنیم که بخواهیم تعدادی View ی دیگر که فضای نسبتاً زیادی اشغال می کنند را در معرض دید کاربر قرار دهیم به این صورت که با اسکرول کردن بتواند کلیه آن ها را مشاهده نماید.

ScrollView می بایست یک حاوی یک Child باشد. در اینجا منظور از Child یک View دیگر است تا هر آنچه که می خواهیم اسکرول شود را داخل آن قرار دهیم و به طور معمول این Child یک LinearLayout می باشد.

به عبارت دیگر روی رابط کاربری یک ScrollView قرار داده، داخل آن یک LinearLayout قرار می دهیم سپس هر آنچه که می خواهیم اسکرول شود را داخل آن LinearLayout قرار خواهیم داد. " عمودی نکته بسیار مهم آن است که ScrollView فقط و فقط اسکرول به صورت Vertical یا " را ساپورت می کند بنابراین نیاز است که برای LinearLayoutیی که داخل ScrollView در نظر می گیریم از Attributeیی تحت عنوان orientation استفاده نموده و مقدار آن را برابر با vertical قرار دهیم.

حال برای این که بتوانیم مطالب تئوری فوق را به صورت عملی مورد بررسی قرار دهیم، ابتدا نیاز است تا یک Layout جدید داخل پروژه ButtonEffects ایجاد کرده که به محض کلیک کردن روی دکمه قرار گرفته روی UI اصلی این اپ، به UI جدید انتقال پیدا کنیم (نیاز به توضیح نیست که برای این منظور می بایست ابتدا یک کلاس جدید ایجاد کرده، سپس این کلاس را به UI جدید لینک داده و در نهایت هم آن را داخل فایل AndroidManifest.xml تعریف نماییم. در ادامه کدهای لازم برای لینک دادن دکمه اصلی اپ به UI دوم را تکمیل نماییم):

همانطور که در تصویر فوق مشخص است، UI جدید اپ که scroll_view.xml نام دارد را باز نموده سپس از Tab مربوط به Composite تگ ScrollView را کشیده و روی UI رها می کنیم. اگر از حالت Graphical Layout خارج شویم، کدهای زیر را مشاهده خواهیم کرد:

همانطور که در کدهای فوق مشاهده می شود، یک ScrollView ایجاد شده که به صورت خودکار یک LinearLayout هم داخل آن قرار گرفته است. اولین کاری که می بایست انجام دهیم این است که LinearLayoutیی را که داخل ScrollView قرار دارد را به صورت vertical در آوریم. برای این منظور، کدهای فوق را به صورت زیر تکمیل می کنیم:

کنون می بایست داخل تگ LinearLayout تعدادی View قرار دهیم (در این جا View هر چیزی می تواند باشد، از دکمه گرفته تا TextView، تصویر و ...). برای مثال یک دکمه در نظر می گیریم:

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

در ادامه برای آن که دکمه ها از هم تمیز داده شوند، نیاز است تا یک خط افقی مابین دکمه ها قرار گیرد. برای این منظور، کدهای فوق را به صورت زیر تکمیل می کنیم:

همانطور که مشاهده می شود، پایین دکمه قبل، یک دکمه دیگر قرار داده با این تفاوت که ارتفاع آن نیم dip است و رنگ آن مشکی است. حال کدهای مربوط هر دو دکمه را چندین بار Copy و Paste کرده تا ارتفاع کل آن ها از اندازه دستگاه اندرویدی بیشتر شود تا حالت اسکرول فعال شود (در حدود 22 بار).

اکنون می توانیم اپ را یک بار اجرا کنیم:

می بینیم که به چه سادگی می توان حالت اسکرول را ایجاد کرد. در ادامه می خواهیم کاری کنیم تا وقتی روی اولین "فصل اول کتاب" کلیک کردیم به یک صفحه دیگر ارجاع داده شویم. برای این منظور کدهای مرتبط با کلاس ScrollView.java را به صورت زیر تکمیل می کنیم:

کاری که در کد فوق انجام داده ایم این است که کلاس ScrollView را از کلاس OnClickListener اصطلاحاً implements کرده ایم. زمانی که این کار را انجام می دهیم، IDE از ما ایراد می گیرد که متد مرتبط با کلاس OnClickListener فرا خوانده نشده است. بنابراین برای رفع این مشکل متد onClick این کلاس را به کدهای خود اضافه می کنیم. 

در ادامه نیاز است تا یک شیئ از روی کلاس Button ساخته و آن را به دکمه ای که در فایل XML حاوی id یی معادل با firstButton بود لینک دهیم:

همانطور که در کد فوق مشاهده می شود، متد setOnClickListener را به شیئ ساخته شده از روی کلاس Button ضمیمه کرده و با قرار دادن کلیدواژه this به عنوان پارامتر این متد، این دستور را کامپایلر می دهیم که به محض کلیک شدن روی این دکمه، هر دستوری که داخل متد onClick بود را عملی سازد.

در ادامه نیاز است تا یک صفحه جدید ایجاد کنیم تا به محض کلیک روی دکمه اول به آن صفحه ارجاع داده شویم. برای این منظور ابتدا یک فایل XML تحت عنوان sample_page.xml در فولدر layout ایجاد می کنیم:

اکنون یک کلاس جدید تحت عنوان SamplePage.java ایجاد کرد و آن را به این فایل لینک می دهیم:

به سادگی طبق آموزش های گذشته این کلاس را داخل فایل AndroidManifest.xml تعریف می کنیم:

اکنون که صفحه مرتبط با دکمه اول ساخته شد، مجدد به فایل ScrollView.java باز می گردیم و با استفاده از کلاس Intent کاری می کنیم که به محض کلیک شدن روی دکمه اول، به Activity مرتبط با SamplePage.java اختصاص داده شویم:

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

در ادامه قصد داریم تا لی اوت مرتبط با sample_page.xml را مجدد با استفاده از ScrollView تکمیل کنیم. برای این منظور، این فایل را به صورت زیر تکمیل می کنیم:

همانطور که در کد فوق می بینیم، یک ScrollView روی UI قرار داده و داخل آن هم یک LinearLayout با حالت عمودی قرار داده ایم. در ادامه یک TextView داخل LinearLayout قرار خواهیم داد:

همانطور که در کد فوق ملاحظه می شود، gravity این TextView را برابر با right قرار داده ایم تا متن فارسی ما از راست به چپ چیده شود. اندازه متن را هم تا حدودی بزرگ گرفته ایم تا حالت اسکرول صفحه عملی شود که در غیر این صورت صفحه اسکرول نخواهد خورد. حال اپ را تست می کنیم:

.

به خاطر داشته باشیم که یکی از نقاط ضعف سیستم عامل اندروید این است که از حالت Justify پشتیبانی نمی کند اما این در حالی است که این مسئله بدون راه حال هم نیست.

به طور مثال می توان از WebView برای رفع این مشکل استفاده کرد و یا برخی توسعه دهندگان، کلاس هایی را برای رفع این مشکل نوشته اند که با افزودن آن کلاس ها به پروژه خود به راحتی می توان متن را Justify کرد

 

پس از مطالعه این آموزش انتظار می رود بتوانیم به سؤالات زیر پاسخ بدهیم:

1. چرا داخل ScrollView می بایست از یک LinearLayout استفاده کرد؟

Orientation .2 مرتبط با LinearLayout برای ScrollView می بایست دارای چه مقداری باشد؟ چرا؟

3. به چه شکل می توان یک دکمه را اصطلاحاً Transparent یا "شفاف" کرد؟

 

برای مشاهده نظرات وارد سایت شوید یا ثبت‌نام کنید.

86th_Session,_An_Introduction_fo_ScrolView.pdf

لینک دانلود فایل درس آشنایی با ScrollView در اندروید

سرفصل های آموزشی دوره رایگان برنامه نویسی اندروید Android

منبع این درس در سایت سکان (www.sokanacademy.com)