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

3 سال پیش

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

در این درس از مجموعه آموزش برنامه نویسی سایت سورس باران، در مورد تست رابط کاربری در برنامه نویسی اندروید صحبت خواهیم کرد.

Android SDK ابزارهای زیر را برای پشتیبانی از تست رابط کاربری در برنامه نویسی اندروید به صورت خودکار و کاربردی در برنامه شما فراهم می کند.

uiautomatorviewer
uiautomator

uiautomatorviewer

(GUI) ابزار رابط کاربری گرافیکی برای اسکن و تجزیه و تحلیل اجزای UI یک برنامه اندرویدی می باشد

ابزار uiautomatorviewer یک رابط بصری مناسب برای بررسی سلسله مراتب طرح و مشاهده خصوصیات مولفه های UI منفردی که در دستگاه تست نمایش داده می شوند، فراهم می کند.

با استفاده از این اطلاعات، بعداً می توانید تست های uiautomator را با اشیا انتخابی ایجاد کنید که مولفه های خاص UI را برای تست هدف قرار می دهند.

برای تجزیه و تحلیل اجزای UI برنامه ای که می خواهید تست کنید، مراحل زیر را پس از نصب برنامه ارائه شده در مثال انجام دهید.

دستگاه Android خود را به development machine خود متصل کنید
یک پنجره ترمینال باز کنید و به <android-sdk> / tools / بروید
ابزار را با این دستور اجرا کنید

uiautomatorviewer

دستورات مطابق شکل زیر دنبال می شوند

مشاهده خواهید کرد که پنجره زیر ظاهر می شود. این پنجره پیش فرض UI Automator Viewer است.

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

پس از آن، اسنپ شات از صفحه دستگاه خود را در پنجره uiautomatorviewer مشاهده خواهید کرد.

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

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

UI Automator Viewer همچنین به شما کمک می کند تا UI خود را در جهت گیری های مختلف بررسی کنید.

به عنوان مثال، فقط جهت دستگاه خود را به حالت افقی تغییر دهید و دوباره اسنپ شات را بگیرید. در شکل زیر نشان داده شده است

uiautomator

اکنون می توانید موارد تست خود را ایجاد کرده و برای بررسی آنها با uiautomatorviewer اجرا کنید. برای ایجاد مورد تست خود، باید مراحل زیر را انجام دهید:

از Project Explorer، بر روی پروژه جدیدی که ایجاد کرده اید کلیک راست کنید، سپس Properties> Java Build Path را انتخاب کرده و موارد زیر را انجام دهید.
روی Add Library> JUnit کلیک کنید و سپس JUnit3 را انتخاب کنید تا پشتیبانی JUnit اضافه شود.
روی Add External JARs کلیک کنید … و به فهرست SDK بروید. در زیر فهرست سیستم عامل ها، آخرین نسخه SDK را انتخاب کنید و هر دو فایل uiautomator.jar و android.jar را اضافه کنید.
کلاس خود را با UiAutomatorTestCase گسترش دهید
اصلاح موارد تستی لازم.
پس از رمزگذاری تست خود، این مراحل را برای ساخت و استقرار تست JAR در دستگاه تست Android هدف خود دنبال کنید.
برای ساخت JAR خروجی، فایل های پیکربندی ساخت مورد نیاز را ایجاد کنید. برای تولید فایل های پیکربندی ساخت، یک ترمینال را باز کنید و دستور زیر را اجرا کنید:

<android-sdk>/tools/android create uitest-project -n <name> -t 1 -p <path>

<name> نام پروژه ای است که شامل پرونده های منبع تست uiautomator شما می باشد و <path> مسیر دایرکتوری پروژه مربوطه است.
از خط فرمان ، متغیر ANDROID_HOME را تنظیم کنید.

set ANDROID_HOME=<path_to_your_sdk>

به فهرست پروژه ای که فایل build.xml شما در آن قرار دارد بروید و تست JAR خود را بسازید.

ant build

با استفاده از دستور adb push، فایل JAR تولید شده خود را در دستگاه تست قرار دهید

adb push <path_to_output_jar> /data/local/tmp/

آزمون خود را با دنبال کردن دستور اجرا کنید –

adb shell uiautomator runtest LaunchSettings.jar -c com.uia.example.my.LaunchSettings

مثال

مثال زیر استفاده از تست رابط کاربری در برنامه نویسی اندروید را نشان می دهد. این برنامه می تواند برای uiautomatorviewer استفاده شود.

برای آزمایش این مثال، باید این مورد را روی یک دستگاه واقعی اجرا کنید و سپس مراحل uiautomatorviewer که در ابتدا توضیح داده شد را دنبال کنید.

شرح مراحل

۱- شما برای ایجاد یک برنامه اندرویدتحت یک پکیج com.tutorialspoint.myapplication از Android studio استفاده خواهید کرد.
۲- برای افزودن کد فعالیت ، فایل src / MainActivity.java را تغییر دهید.
۳- طرح XML را تغییر دهید فایل res / layout / activity_main.xml در صورت لزوم، هر جز GUI اضافه کنید.
۴- برای افزودن کد فعالیت ، پرونده src / second.java ایجاد کنید.
۵- طرح مورد نظر را تغییر دهید فایل XML res / layout / view.xml در صورت لزوم ، هر جز GUI اضافه کنید.
۶- برنامه را اجرا کنید و دستگاه اندرویدی در حال اجرا را انتخاب کنید و برنامه را روی آن نصب کنید و نتایج را بررسی کنید.

در اینجا محتوای MainActivity.java است.

package com.tutorialspoint.myapplication;

import android.content.Intent;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends ActionBarActivity {
   Button b1;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);

      b1=(Button)findViewById(R.id.button);
      b1.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            Intent in =new Intent(MainActivity.this,second.class);
            startActivity(in);
         }
      });
   }
}

در اینجا محتوای second.java است.

package com.tutorialspoint.myapplication;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class second extends Activity {
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.view);
      Button b1=(Button)findViewById(R.id.button2);
      
      b1.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            Toast.makeText(second.this,"Thanks",Toast.LENGTH_LONG).show();
         }
      });
   }
}

در اینجا محتوای activity_main.xml است

<?xml version="1.0" encoding="utf-8"?>
<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:paddingLeft="@dimen/activity_horizontal_margin"
   android:paddingRight="@dimen/activity_horizontal_margin"
   android:paddingTop="@dimen/activity_vertical_margin"
   android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">
   
   <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="UI Animator Viewer"
      android:id="@+id/textView"
      android:textSize="25sp"
      android:layout_centerHorizontal="true" />
      
   <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Tutorials point"
      android:id="@+id/textView2"
      android:layout_below="@+id/textView"
      android:layout_alignRight="@+id/textView"
      android:layout_alignEnd="@+id/textView"
      android:textColor="#ff36ff15"
      android:textIsSelectable="false"
      android:textSize="35dp" />
      
   <ImageView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/imageView"
      android:src="@drawable/abc"
      android:layout_below="@+id/textView2"
      android:layout_centerHorizontal="true" />
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Button"
      android:id="@+id/button"
      android:layout_marginTop="98dp"
      android:layout_below="@+id/imageView"
      android:layout_centerHorizontal="true" />

</RelativeLayout>

در اینجا محتوای view.xml وجود دارد.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:orientation="vertical" android:layout_width="match_parent"
   android:layout_height="match_parent">

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text=" Button"
      android:id="@+id/button2"
      android:layout_gravity="center_horizontal"
      android:layout_centerVertical="true"
      android:layout_centerHorizontal="true" />
</RelativeLayout>

در اینجا محتوای Strings.xml وجود دارد

<resources>
   <string name="app_name">My Application</string>
</resources>

در اینجا محتوای AndroidManifest.xml است.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.tutorialspoint.myapplication" >
   
   <application
      android:allowBackup="true"
      android:icon="@mipmap/ic_launcher"
      android:label="@string/app_name"
      android:theme="@style/AppTheme" >
      
      <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>
      
      <activity android:name=".second"></activity>
      
   </application>
</manifest>

بیایید برنامه را اجرا کنیم. من تصور می کنم شما AVD خود را هنگام راه اندازی محیط ایجاد کرده اید. برای اجرای برنامه از Android studio، یکی از پرونده های فعالیت پروژه خود را باز کنید و از نوار ابزار روی Android StudioRun Icon کلیک کنید. Android Studio برنامه را روی AVD شما نصب کرده و شروع به کار می کند و اگر با تنظیمات و برنامه هایتان همه چیز خوب باشد، زیر پنجره شبیه ساز نمایش داده می شود.

دستگاه همراه خود را به عنوان گزینه انتخاب کنید و سپس دستگاه همراه خود را که صفحه برنامه را نشان می دهد، بررسی کنید. اکنون برای انجام تست ui روی این برنامه، فقط مراحل ذکر شده در بالا را در قسمت ui automator viewer دنبال کنید.

منبع.

لیست جلسات قبل آموزش برنامه نویسی اندروید

نویسنده مطلب erfan molaei

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

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

uiautomatorviewer

uiautomator

مثال

شرح مراحل

لیست جلسات قبل آموزش برنامه نویسی اندروید

دیدگاه شما

بدون دیدگاه

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

uiautomatorviewer

uiautomator

مثال

شرح مراحل

لیست جلسات قبل آموزش برنامه نویسی اندروید

دیدگاه شما

برای صرف‌نظر کردن از پاسخ‌گویی اینجا را کلیک نمایید.

بدون دیدگاه