در این مقاله به مفاهیم اساسی XML در اندروید و فایلهای مختلف XML میپردازیم که برای اهداف مختلف در اندروید استفاده میشوند. اگر میخواهید بدانید که Xml در اندروید چیست و چه کاری انجام میدهد در ادامه با آموزش XML در اندروید استودیو و طراحی Ui در اندروید همراه ما باشید تا با آن آشنا شوید و بتوانید با آن کار کنید.
XML مخفف کلمهی Extensible Markup Language میباشد. مبانی و فایلهای مختلف XML در اندروید مورد استفاده قرار میگیرد. XML یک زبان نشانه گذاری است که درست مانند HTML برای توصیف دادهها استفاده میشود.
در اندروید ما از XML برای طراحی Layout استفاده میکنیم زیرا XML یک زبان بسیار ساده و سبک میباشد، بنابراین باعث نمیشود طراحیهای Layout ما سنگین و کند شوند.
XML به شما در نوشتن کد رابط کاربری (UI) کمک میکند تا رابط کاربری مورد نظر خود را طراحی کنید.
تگهای XML درون فایلهای XML از پیش تعریف نشدهاند. ما باید تگ هایی که لازم داریم را خودمان تعریف کنیم. XML زبانی بسیار ساده و مقیاس پذیر است که هم توسط انسان و هم از نظر دستگاه قابل خواندن است.
در اندروید استودیو، شما با استفاده از زبان نشانه گذاری XML میتوانید به راحتی به طراحی UI در اندروید بپردازید. در این مقاله شما با XML به طور کلی آشنا میشوید و فقط باید برای طراحی UI در اندروید با ویوها و ویژگیهای آن آشنا شوید تا بتوانید رابط کاربری مورد نظر خود را بسازید. در این مقاله ما با مثالی ساده طراحی UI در اندروید را به شما نشان خواهیم داد.
کل مفهوم رابط کاربری اندروید با استفاده از سلسله مراتب اشیاء View و ViewGroup تعریف شده است. ViewGroup یک ظرف پنهان میباشد که child views را سازمان میدهد. این child viewها ویجتهای دیگری است که برای ساخت قسمتهای مختلف UI استفاده میشود.
همانطور که در شکل زیر نشان داده شده است، یک ViewGroup میتواند ViewGroup دیگری به عنوان عنصر child داشته باشد:
در نمودار بالا LinearLayout) ViewGroup) شامل یک RelativeLayout) ViewGroup) و دو Button , TextView) View) است. علاوه بر این، دو View دیگر (یعنی 2 EditText) در داخل صفحه نمایش RelativeLayout واقع شدهاند.
توجه به این نکته مهم است که میتوان یک Layout را در یک Layout دیگر اضافه کرد.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/buton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"/>
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="sample Text"
android:layout_marginTop="15dp"
android:textSize="30dp"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="@+id/editTextName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="First Name"
/>
<EditText
android:id="@+id/editTextLastName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="Last Name"/>
</RelativeLayout>
</LinearLayout>
خروجی کد بالا :
هر صفحه، برنامههای اندرویدی دارای برخی از مولفهها مانند دکمه ، متن یا تصاویر است. این موارد در داخل ViewGroup موجود است. Layoutها بهترین نمونه برای ViewGroupها است. انواع مختلف Layoutها در اندروید عبارتند از: ترسیم خطی (Linear Layout)، چیدمان نسبی (Relative Layout)، چیدمان مطلق (Absolute Layout)، چیدمان جدول (Table Layout) و چیدمان فریم (Frame Layout).
به این نکته توجه داشته باشید که لایه بندی زیاد (یعنی استفاده تو در تو از Layoutها) باعث سنگین شدن رابط کاربری ما میشود.
هر نوع Layout دارای ویژگی هایی است که نحوهی ظاهر عناصر آن را مشخص میکند. ویژگیهای Layoutهای ذکر شده در بالا در ادامه آمده است.
موارد زیر ویژگی هایی است که برای همهی طرحها اعمال میشود:
نسخههای جدید Android Studio به جای LinearLayouts یا RelativeLayouts طرحهای پیشفرض به نام ConstraintLayouts ایجاد میکند. Constraint Layouts یک قالب طرح جدیدتر است که قدرتمندتر است و کار با آن به صورت Drag and drop میباشد.
از فایلهای Layout xml برای تعریف UI (رابط کاربری) برنامه استفاده میشود. این شامل تمام عناصر (Views) یا ابزاری است که
<!-- RelativeLayout in which we set green color for the background -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/greenColor"
tools:context=".MainActivity">
<TextView
android:id="@+id/firstTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_margin="20dp"
android:padding="10dp"
android:text="First Text View"
android:textColor="@color/white"
android:textSize="20sp"
android:textStyle="bold" />
<!-- second TextView -->
<TextView
android:id="@+id/secondTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/firstTextView"
android:layout_centerHorizontal="true"
android:layout_margin="20dp"
android:padding="10dp"
android:text="Second Text View"
android:textColor="@color/white"
android:textSize="20sp"
android:textStyle="bold" />
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="example.abhiandroid.MyApplication"> <!-- application package name -->
<uses-permission android:name="ANDROID.PERMISSION.INTERNET" />
<!-- define Internet Permission -->
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme">
<!-- add your Activities, Receivers, Services Names Here -->
<activity
android:name=".MainActivity"
android:label="@string/app_name">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
<resources>
<string name="app_name">My Application</string>
<string name="hello_world">Hello world!</string>
<string name="action_settings">Settings</string>
<string name="login">User Login</string>
<!-- define your strings here -->
</resources>
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
</style>
</resources>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- define start, center and end color for gradient -->
<gradient
android:centerColor="#0f0"
android:endColor="#00f"
android:startColor="#f00" />
</shape>
در زیر پروندههای color.xml را نشان میدهیم که در آن رنگ سبز و سفید را تعریف میکنیم.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- define your colors Here -->
<color name="greenColor">#0f0</color>
<color name="white">#fff</color>
</resources>
جمعبندی
در این مقاله شما با Xml در اندروید آشنا شدید و فهمیدید که XML یک زبان نشانه گذاری بسیار ساده برای یادگیری هست. خوانایی زبان XML بسیار بالاست و به راحتی میتوان آن را درک کرد. شما میتوانید با آن رابط کاربریهای دلخواه را طراحی کرده و از آن لذت ببرید. امیدواریم این مقاله برای شما مفید باشد اگر سوالی داشتید با ما و کاربران سون لرن به اشتراک بگذارید.
منبع این مقاله:
اگر به یادگیری بیشتر در زمینهی برنامه نویسی اندروید علاقه داری، با شرکت در دورهی آموزش برنامه نویسی اندروید در کمتر از یکسال به یک توسعهدهنده اندروید همه فن حریف تبدیل میشوی که آمادهی استخدام، دریافت پروژه و حتی پیادهسازی اپلیکیشن خودت هستی.