آموزش HorizontalScrollView به زبان کوتلین در اندروید
سلام دوستان در این سری از آموزش برنامه نویسی اندروید به آموزش HorizontalScrollView به زبان کوتلین در اندروید می پردازیم در این آموزش یک ScrollView افقی یا Horizontal ایجاد می کنیم در اینجا از HorizontalScrollView به منظور ساخت یک scroll افقی استفاده می کنیم در ادامه با ما همراه باشید تا نحوه استفاده از HorizontalScrollView را یاد گیرید.
کوتلین (kotlin) چیست ؟
چرا باید از زبان کوتلین در اندروید استفاده کنیم ؟
آموزش اضافه کردن kotlin به اندروید استودیو
وارد مسیر res/values شده و فایل strings.xml را باز کرده وکدهای زیر را در آن قرار دهید.
1 2 3 4 | <resources> <string name="app_name">HorizontalScrollView - Programchi</string> <string name="no_image">No Image</string> </resources> |
قبل از اینکه وارد کد بشویم ابتدا باید یکسری عکس را از لینک زیر دانلود کرده و در پوشه drawable قرار دهید.
لینک دانلود
بعد از اینکار وارد layout اصلی خودتان شده در اینجا نام آن برابر با activity_main.xml است.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | <?xml version="1.0" encoding="utf-8"?> <HorizontalScrollView android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="20dp" android:orientation="horizontal"> <ImageView android:id="@+id/image1" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:contentDescription="@string/no_image" android:src="@drawable/guava"/> <ImageView android:id="@+id/image2" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginRight="20dp" android:contentDescription="@string/no_image" android:src="@drawable/jackfruit"/> <ImageView android:id="@+id/image3" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginRight="20dp" android:contentDescription="@string/no_image" android:src="@drawable/mix_fruit"/> <ImageView android:id="@+id/image4" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginRight="20dp" android:contentDescription="@string/no_image" android:src="@drawable/pomegranate"/> <ImageView android:id="@+id/image5" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginRight="20dp" android:contentDescription="@string/no_image" android:src="@drawable/strawberry"/> <ImageView android:id="@+id/image6" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginRight="20dp" android:contentDescription="@string/no_image" android:src="@drawable/zespri_kiwi"/> </LinearLayout> </HorizontalScrollView> |
در بالا ما یکسری Image قرار دادیم که باعث اسکرول شدن شود. همانطور که در آموزش قبلی ScrollView گفتیم که باید هر ScrollView یک Child یا فرزند داشته باشد در اینجا هم به همین شکل است.
در بخش MainActivity.kt هم همانند زیر چیز خاصی قرار نگرفته است.
1 2 3 4 5 6 7 8 9 | package ir.programchi.horizontalscrollview import android.os.Bundle import android.support.v7.app.AppCompatActivity class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) } } |
و در صورتی که بخواهید HorizontalScrollView را find کنید می توانید از کد زیر استفاده کنید.
به سهشکل find کردن امکان پذیر است.
حالت اول
1 | val scrollbar= findViewById(R.id.scroll) as HorizontalScrollView |
حالت دوم
1 | val scrollview:HorizontalScrollView = findViewById(R.id.scrollview) |
حالت سوم
1 | val scrolls = findViewById<HorizontalScrollView>(R.id.scroollllbarrrr) |
استفاده کلی از ScrollView افقی همانند زیر است.
1 2 3 4 5 6 7 8 9 10 11 | <?xml version="1.0" encoding="utf-8"?> <HorizontalScrollView android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="20dp" android:orientation="horizontal"> </LinearLayout> </HorizontalScrollView> |
این آموزش هم به پایان رسید.
موفق باشید.