آموزش برنامه نویسی اندروید با اندروید استودیو (بخش هجدهم: کار با وب ویو در اندروید)

استاندارد

اگر بخواهید صفحات وب را در برنامه اندرویدی خود داشته باشید چه کار باید کرد؟

در این بخش از آموزش، قصد داریم با وب ویو کار کنیم.در ابتدا یک توضیح مختصری در مورد وب ویو داشته باشیم.

وب ویو وظیفه نمایش وب را در اختیار دارد. از Web view برای نمایش یک وبسایت ویا کدهای Html استفاده می کنیم.

کارکردن با وب ویو بسیار آسان است. زیرا نیازی به مهارت و یا دانش برنامه نویسی وب برای کار کردن، ندارد.
غیر از مواقع حرفه ای که در اموزش های پیشرفته اندروید باهاش کار خواهیم کرد.

کار با وب ویو را شروع می کنیم.

یک پروژه جدید را شروع می کنیم. از قسمت پالت ها، ابزار WebView را از پوشه Containers به لایه اپلیکیشن خود می کشیم.

android-studio-beginners-gsm-developers_58

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

<WebView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true" />

اگر WebView شما نیز مانند پروژه من فاقد آی دی بود، به آن یک آیدی بدهید.

مثلا من با اضافه کردن خط زیر آیدی WebView را به وب ویو پروژه خودم دادم.

android:id="@+id/WebView"

مستقیما به سراغ کد جاوای اصلی MainActivity می رویم تا کدی بنویسیم که یک صفحه وب را در اپلیکیشن اندرویدی خود، مشاهده نماییم.

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

بدیهی است که به جای سایت گوگل می توان از هر سایت دیگری نیز، استفاده نمود.

WebView web = (WebView) findViewById(R.id.WebView);

web.loadUrl("https://www.google.com/");

پس کد جاوای اصلی برنامه بدین صورت می باشد.

package com.gsm_developers.gsm_webview;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebView;

public class MainActivity extends AppCompatActivity {

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

        WebView web = (WebView) findViewById(R.id.WebView);

        web.loadUrl("https://www.google.com/");
    }
}

پس از اجرای کد، مشاهده می کنید که برنامه ی شما به صفحه ی اینترنت دسترسی ندارد.

android-studio-beginners-gsm-developers_59

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

در بخش های اول آموزش، با فایل AndroidManifest آشنا شده ایم. این فایل در پوشه Manifests است.

باید در این فایل، با نوشتن یک خط کد به اپلیکیشن خود، اجازه دسترسی به اینترنت را بدهیم.

کدهای فایل AndroidManifest را باز کرده، سپس قبل از تگ application> یک تگ باز می کنیم و user-permission را تایپ می کنیم. محیط اندروید استودیو به ما پیشنهاد کامل کردن کد را  می دهد که می توانیم مانند عکس زیر، android.permission.Internet را انتخاب نماییم.

android-studio-beginners-gsm-developers_60

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

<uses-permission android:name="android.permission.INTERNET"></uses-permission>

پس کد اصلی AndroidManifest به صورت زیر خواهد بود:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.gsm_developers.gsm_webview">
// خط زیر اضافه شده است
<uses-permission android:name="android.permission.INTERNET"></uses-permission>
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />

            </intent-filter>
        </activity>
    </application>

</manifest>

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

خروجی زیر را مشاهده خواهید کرد.

android-studio-beginners-gsm-developers_61