ساخت کتاب با ListView در بیسیک 4 اندروید

ساخت کتاب با ListView در بیسیک 4 اندروید

در این قسمت شما را با ساخت کتاب با ویژگی های که بیشتر کاربران احتیاج به آن دارند آشنا می کنیم  انشاالله با نظرات خود ما را یاری کنید ....!!

نکته (برای زیبای کار خود حتما طرح های زیبا درست کنید تا برنامتون بهتر و قشنگ تر بشه )

شروع آموزش

خوب مثل همیشه برنامه را باز کرده و در زیر منوی Project قسمت Package Name کلیک کرده و یک نام که بعنوان مثال ما آن را  Book.B4a قرار دادیم می نویسیم

توجه: اینجا باید اسم برنامه چند بخشی باشد بخاطر همین هم در وسط book و b4a نقطه (.)می گذاریم

حالا به صفخه کد نویسی مراجعه میکنیم و در قسمت Region در جلوی ApplicationLabel نام برنامه رو  تغییر می دهیم (این مطالب قبلا توضیح داده شده )
و مقدار FullScreen را True جهت تمام صفحه شدن
و مقدار IncludeTitle را  False جهت غیر فعال کردن عنوان صفحه انجام می دهیم

خوب در اینجا می خوایم برای ریبا تر کردن کتابمون یک splash بسازیم

توجه : دوستان اگر با مراحل این قسمت درست آشنایی ندارید حتما این قسمت رو هم کار کنید برای زیبای برنامه خیلی بدرد بخور هستش splash

خب برای آشنایی بیشتر شما عزیزان در همین مرحله باز هم توضیح می دم
در صفحه اصلی یا همان main  به پنجره designer وارد میشویم و یک layout با نام start می سازیم و در قسمت   ِDesigner > Activity > Activity Properties > images file > Add images  رو کلیک کنید و یک عکس انتخاب کنید

حالا به این قسمت میریم که بتونیم عکس انتخابی رو برای صفحه اصلی مشخص کنیم

Designer > Activity > Activity Properties > drawable > Bitmapdrawable >images file

خوب حالا layout رو ذخیره میکنیم و به صفحه کد نویسی می رویم و کد زیر را می نویسیم

خوب در عکس بالا در قسمت timer_tick ما یک ارتباط با صفحه ای دیگر را دادیم که اسم اون صفحه رو s1 قرار دادیم که پس از گذشت زمان صفحه splash ما به صفحه دوم یا s1 انتقال پیدا کنه
حالا ما احتیاج به یک صفحه جدید یا Activity Module نیاز داریم که برای ساختن اون مانند شکل های زیر عمل و نام آن صفحه را s1 قرار دهید .

خوب صفحه بعد ما به نام s1 ساخته شد
حالا به پنجره designer وارد میشیم و یک layout با نام s1 قرار می دهیم

توجه : اگر نام صفحه(Activity Module) و نام لای اوت ( layout ) با هم یکی باشد در صد خطا کمتر می باشد همانند ما که نام هر دو را s1 قرار دادیم .

خوب حالا از زیر منوی Add view > ListView1 رو انتخاب کنید (توضیح داده شده)

که در عکس پایین ListView1 انتخابی  می باشد

و اون رو به برنامه معرفی می نماییم (قبلا توضیح داده شده)

در این صفحه یا همان s1 به پنجره designer وارد میشویم و یک layout با نام s1 می سازیم و در قسمت   ِDesigner > Activity > Activity Properties > images file > Add images  رو کلیک کنید و یک عکس انتخاب کنید (مانند مراحل قبل که عکس انتخاب می کردیم)

حالا به این قسمت میریم که بتونیم عکس انتخابی رو برای صفحه اصلی مشخص کنیم

Designer > Activity > Activity Properties > drawable > Bitmapdrawable >images file

و در قسمت Designer Scripts محل قرار گیری  ListView1  را مشخص می کنیم .


 
خوب حالا layout رو ذخیره میکنیم و به صفحه کد نویسی می رویم و مانند شکل زیر کد ها را می نویسیم

در شکل بالا در قسمت Sub Globals مشاهده می کنید ما یک ListView تعریف کر ده ایم

و در قسمت Activity_Create نیز کدهایی را جهت ساخت لیست در ListView  تعریف  می کنیم

که در خط 18 layout خود را فراخوانی می کنیم
در خط 19 تا  21 سه منو یا سه خط در  ListView  ایجاد می کنیم
در خط 23  مقدار ارتفاع هر منو را در  ListView   را dip مشخصی می کنیم
در خط 24  مقدار سایز نام منو را مشخص می کنیم 
در خط  25 رنگ نام منو را مشخص می کنیم
در خط  26 میگویم که منو های ما وسط چین قرار بگیرد

حالا باید در این فسمت عکس پس زمینه  منوها  رو در  ListView  مشخص کنیم .
در خط 28 یک متغییر از نوع BitmapDrawable  می سازیم
و در خط 29 اون رو Initialize و عکس مورد نظر زو فرا خوانی می کنیم
نکته : تمام عکس ها و فونت ها و فایلهای که باید در برنامه نشون داده بشن در قسمت فایل پایین سمت  چپ  برنامه add شده باشن .

و در خط 30 مشخص می کنیم که عکس پس زمینه انتخابی برای هر منو در ListView   فعال بشه.

خب حالا در عکس پایین می خواهیم بگوییم که با کلیک کردن بر روی هر منو به یک صفحه برود
که برای این کار از دستور زیر استفاده می کنیم



نکته خیلی مهم : حلقه If یک قید شرطی هستش که به صورت زیر نوشته می شه

then  جواب =سئوال If
دستور
End If

که  هر کدام از منو های ساخته شده برای ساختن دستور از 0 شروع می شود مانند شکل بالا

که ما می گوییم اگر (if) سئوال (Position ) = جواب منو اول (مقدارش را صفر میدهیم 0)  چکار کند حالا دستور(" StartActivity("s2  به صفحه بعد برو و در پایان end if را قرار می دهیم

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

خب حالا می خواهیم دستوراتی که به هر منو در لیست ویو داده ایم را عملی کنیم

خوب در عکس بالا  ما به هر منو یک ارتباط به وسیه StartActivity دادیم تا به صفحه ای دیگر برویم و ما احتیاج به دو صفحه دیگر داریم  که اسم اون صفحه ها رو s2 و s3 قرار می دهیم و برای هر کدام یک layout  با همان  نام ها می سازیم (دز بالا آموزش داده شد)

حالا به صفحه سوم که همان s2 می باشد می رویم و مانند مراحل قبل یک عکس برای بگراند آن قرار می دهیم (در بالا آموزش داده شد)

خب حالا به منوی Designer بروید و یک ScrollView1 یسازید سپس مانند  شکل زیر از قسمتVisibel  اون رو False   کنید و ..

حالا به صفحه کد نویسی می رویم و کد زیر را می نویسیم
دوستان توجه داشته باشد جهت ساخت این صفحه فقط با استفاده با کد نویس انجام می گیرید

در قسمت Globals مانند شکل بالا  چند متغیر درست می کنیم که:

در خط 15 یک  ScrollView  معرفی می کنیم
در خط 16 یک  Int جهت ارتفاع پنل در ScrollView  معرفی می کنیم
در خط 17  یک متغییر  از نوع String جهت نمایش متن در ScrollView معرفی می کنیم
در خط 18 یک متغییر از نوع StringUtils جهت تعیین ارتفاع پنل و txt در ScrollViewمعرفی می کنیم
در خط 19 یک متغیر از نوع Float جهت تنظیم ارتفاع در ScrollView با dip معرفی می کنیم
در خط20 یک متغییر از نوع Typeface جهت فراخوانی نوع فونت ما برای نوشته ها معرفی می کنیم

حالا در قسمت Activity_Create می رویم

در خط 25 مثل همیشه layout ساخته شده این صفح رو فراخوانی می کنیم
در خط 26 یک فایل txt که در آن متن ما قرار داره و اون را در پوشه Files برنامه کپی کرده ایم را فرا خوانی می کنیم
در خط 27 هم فونت بکار گیری جهت نمایش متن با آن فونت را فراخوانی می کنیم

در خط 28 تابع ساخت اسکرول ویو را معرفی می کنیم

خب در تابع Scroll باید تنظیماتی را انجام بدهیم که همانند شکل زیر آنها رو می نویسیم

خب در این قسمت هم تابع تنظیم ارتفاع لیبل ها در ScrollView رو تعریف می کنیم

دوستان فعلا تا اینجا داشته باشین تا بعد توضیحات مربوط به دو تابع Scroll و ارتفاع لیبل ها رو توضیح بدم فعلا ...

خب برای صفحه بعد هم که S3 هستش هم این مراحل رو تکرار کنید

در آخر اگر مشکلی داشتید حتما مطرح کنید تا مشکلتون برطرف بشه ....!!!؟؟؟

دانلود عکس های مورد نیاز جهت ساخت این قسمت از آموزش .

 دانلود سورس پروژه

 

 

منتظر نظرات خوبتون هستیم

موفق باشید...

منبع b4airanamozesh