مساحة إعلانية

2016-12-04

كيف تصنع كتاب الكترونى إحترافى بإستخدام مستندات جوجل

بسم الله الرحمن الرحيم

والصلاة والسلام على أشرف المرسلين

سيدنا محمد وعلى آله وصحبه أجمعين

   فى ظل عصر التكنولوجيا الحديثة ،يمكنك تحويل أفكارك وإبداعاتك إلى محتوى رقمى يتابعه الجمهور من خلال أجهزة الكمبيوتر أو أجهزة الهواتف النقالة. فإذا كنت تمتلك موهبة الكتابة والتأليف فأمامك خيارات عديدة لصنع كتب إلكترونية ونشرها ، بل يمكنك أن تقوم بالترويج لها وبيعها على الإنترنت دون اللوجوء إلى الطرق التقليدية مثل دور النشر. 
لذلك سوف أعرض فى هذا الموضوع خطوات صياغة الكتاب الإلكترونى بطريقة إحترافية جذابة بإستخدام مستندات جوجل Google docs وكيفية نشره على الإنترنت والربح منه.
ebook icon

خطوات صنع كتاب إلكترونى بإستخدام Google docs :

1- تجهيز المحتوى:

  تعتبر هذه المرحلة هى الأساس ، فإبدأ بإستخدام ورقة وقلم لترتيب أفكارك وتلخيصها بإسلوب شيق ثم قم بنقل هذا المحتوى لمحرر النصوص Google docs ثم إبدأ بتنسيق النص والفقرات من شريط الأدوات العلوى مع مراعاة هذه النقاط:
Google docs
  1. الخط : يجب أن يكون نوع الخط واضح وملائم للغة المكتوب بها فمثلًا إذا كنت تستخدم اللغة العربية فنوع الخط المناسب هو Arial أو  simplified Arabic كما يجب أن يكون حجم الخط مريح للعين مناسب مع مساحة الصفحة ، يمكن أيضًا إستخدام الخط السميك  B أو المائل I إذا أردت تسليط الضوء على نصوص محددة دون الإفراط فى إستخدامها.
  2. تنسيق الفقرات: إستخدم المسافة البادئة فى أول سطر من كل فقرة مع إستخدام خيارات المحاذاة لليمين أو اليسار أو التوسيط على حسب إحتياجك ولا تنس ضبط الفقرات الطويلة بإستخدام (Ctrl+Shift+j) لتساوى نهايات الأسطر ، مع مراعاة تباعد مناسب للأسطر.
  3.  إحرص على أن تدعم المحتوى بالصور والإنفوجرافيك التى تتعلق بالموضوع لدفع الملل أثناء القراءة .(تابع:كيفية إنشاء إنفوجرافيك)
  4. يمكن إستخدام التنسيقات الإضافية إذا تطلب الأمر مثل التعداد الرقمى والنقطى ،............إلخ.
  5. إستخدم علامات الترقيم (.،-؟) بالمحتوى  النصى و تأكد من خلوه  من الأخطاء الإملائية.
بالطبع هناك إمكانيات أخرى يمكن إستغلالها ولكنى أذكر الأساسيات التى يمكن أن تنتج محتوى منسق بصورة جيدة.

2- تصميم الغلاف:

يمكنك تصميم غلاف جيد حتى وإن لم تكن تجيد التصميم وذلك بمعرفة بعض أساسيات التصميم ببرنامج الفوتوشوب والإعتماد على بعض النماذج الجاهزة و المصادر التى تفيد فى التصميم ، ولا تنسى أن يتضمن تصميم الغلاف بعض المعلومات الأساسية عن الكتاب مثل "عنوان الكتاب ، إسم المؤلف ، شعار ،......"
بعد الإنتهاء من تصميم الغلاف تستطيع إدراجه داخل ملف الكتاب كصورة 
Google docs

3- إنشاء قائمة المحتويات "الفهرس"

   يعتبر جدول المحتويات بمثابة دليل القارئ ، فهو ليس فقط يعرض قائمة بالعناوين الهامة إنما أيضًا تتضمن هذه القائمة روابط بالضغط عليها تقفز إلى الجزء المحدد لها فى صفحات الكتاب وبالتالى فهو يسهل على القارئ عملية التصفح،وإليك خطوات إنشاؤه:
1- عند كتابة المحتوى ككل إختر نمط "نص عادى" ثم إبدأ بتغيير أنماط العناوين على حسب تنسيق المحتوى إلى "عنوان فرعى ، عنوان 1، عنوان 2،.........." وذلك لجميع فقرات الكتاب.
Google docs

2- إذهب إلى الصفحة التى تريد إنشاء الفهرس بداخلها (غالبًا تكون فى بداية الكتاب بعد الغلاف) ثم 
من قائمة إدراج >> إختر قائمة المحتويات (يمكنك الإختيار ما بين ظهور أرقام الصفحات أو الإكتفاء بروابط إلى العناوين)
سيتم إنشاء الفهرس تلقائيا وعند أى تعديل فى الكتاب إضغط على سهم "التحديث" الذى يظهر بجوار جدول المحتويات ليتم إضافة التعديلات فى الفهرس.
Google docs

4- ترقيم الصفحات:

وذلك عن طريق إختيار رقم الصفحة من قائمة إدراج مع إختيار مكان ظهور رقم الصفحة
مستندات جوجل

5-إضافة الروابط :

   ما يميز الكتاب الإلكترونى عن الكتاب المطبوع أنه تفاعلى أى إنه بالإمكان إضافة الروابط التى تؤدى إلى مواقع معينة تدعم المحتوى ، كما يمكن أيضًا إضافة الروابط التى يمكن من خلالها دعوة القراء لمتابعة حساباتك على المواقع الإجتماعية ومتابعة كل جديد ويمكن إدراج هذه الروابط فى صفحة التعريف بالكاتب فى بداية الكتاب 
جوجل وورد

 6- إستخدام صفحات إضافية:

   يمكن إضافة صفحات مثل" السيرة الذاتية للكاتب - إهداء - شكر- حقوق الطبع-..........وغيرها" ويفضل إستخدام تنسيق خاص لهذه الصفحة يختلف عن تنسيق باقى محتوى الكتاب.

7- حفظ الكتاب الإلكترونى

   تعتبر صيغة كتب PDF هى الأشهر على الإنترنت ولكن هناك الكثيرين يفضلون صيغة ePub لتجاوبها مع جميع أحجام الشاشات المختلفة وتوافقها مع الهواتف الذكية ، ومن مميزات مستندات جوجل أنها توفر ميزة إنشاء الكتب الإلكترونية بكلا الصيغتين PDF , ePUB مباشرة بدون إستخدام برامج أخرى 
google pdf
أنصح بتصدير الكتاب بالصيغتين وإعطاء الفرصة للقارئ إختيار الصيغة التى يفضلها.

كيف تنشر كتابك الإلكترونى

الآن جاء الوقت ليطَّلِع الجمهور على إبداعاتك و ترى ثمرة مجهودك، وإليك الإختيار ما بين أمرين :
  1. إما أن تعرض كتابك مجانا ويكون ذلك من خلال التسويق له من خلال الشبكات الإجتماعية أو المواقع والمنتديات.
  2. أو أن تعرضه للبيع وذلك من خلال بعض المواقع المختصة بذلك مثل:
  • بيع الكتب على Google Play  : ولكنها مقتصرة على دول محددة
  • Lulu : يدعم الكتب باللغة العربية  التسجيل فى هذا الموقع مجانى ونسبتك فى الأرباح 90%
  • Payhip : التسجيل فى هذا الموقع مجانى ونسبتك فى الأرباح 95% - يتعامل هذا الموقع بــ"paypal" 
  • متجر Kindle : التابع لموقع Amazon الشهير - نسبتك فى الأرباح [35%-70%]
فى النهاية:
بالتأكيد هناك العديد من البرامج والأدوات الأخرى التى تمكنك من إنشاء كتب إلكترونية ولكنى حاولت شرح أبسط طريقة أتمنى أن تحقق لكم الإفادة .
تابع أيضًا: كيف تحول كتبك إلى تطبيق أندرويد
تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا 

2016-11-27

كيفية تركيب أيقونة لتطبيق الأندرويد ببرنامج Android studio

بسم الله الرحمن الرحيم

والصلاة والسلام على أشرف المرسلين

سيدنا محمد وعلى آله وصحبه أجمعين
   الآن وبعد أن أتممت تطوير وتصميم تطبيق الأندرويد الخاص بك بإستخدام برنامج Android Studio  لا يبقى سوى تركيب أيقونة تعبر عن التطبيق وتحتوى على شعار مشروعك ، لتظهر فى النهاية بشكل مناسب سواء على متجر Google play أو الشاشة الرئيسية على هاتف المستخدم.

android app icon
فى هذا الدرس سأقوم بشرح كيفية إنشاء أيقونة بدء تشغيل التطبيق أو ما يعرف بــ Launcher icon ولكن يمكن تنفيذ نفس الخطوات عند صنع أى أيقونة تُستخدم داخل التطبيق مثل أيقونة الإشعارات أو أيقونات القوائم،.....

كيفية إنشاء أيقونة لتطبيق الأندرويد ببرنامج أندرويد ستوديو

توجه إلى برنامج أندرويد ستوديو ثم من إضغط   File>>New>>>Image Asset
android studio image asset
لتفتح معك نافذة يمكن من خلالها تصميم الأيقونات سواء كانت تتكون من نص أو رمز أو صورة
لاحظ أنه هناك عدة أيقونات بأبعاد مختلفة لتظهر بنفس الجودة على جميع الشاشات بأحجامها المختلفة.

إنشاء أيقونات نصية

وذلك بإختيارText وإستبدال "Aa" بإسم التطبيق الذى يُمثل الأيقونة ، يمكن أيضًا تغيير نوع الخط واللون من خلال هذه النافذة كما بالصورة:
android studio icon generator

إنشاء أيقونات تحتوى على رموز موجودة بالبرنامج Clipart

يحتوى برنامج أندرويد ستوديو عدة رموز يمكن من خلالها تصميم أيقونة خاصة بك ، فعند تحديد Clipart ثم الضغط على رمز الأندرويد ، تفتح نافذة تحتوى على العديد من الرموز
android studio icon
android studio clipart

إنشاء أيقونات تحتوى على صورة 

إذا كنت ستقوم بنشر تطبيقك على جوجل بلاى فعليك بتجهيز صورة بأبعاد 512x512 بكسل.
يمكنك من خلال إختيار image إدراج صورة تحتوى على شعار يعبر عن تطبيقك وذلك من خلال إستدعاء مسار الصورة الموجودة بحاسوبك
android studio launcher icon
إقرأ أيضًا: كيف تصمم شعار إحترافى لتطبيقك؟
  • التحكم فى خصائص الأيقونة
يمكن من خلال نفس النافذة تغيير حجم ، لون الأيقونة ، لون وشكل الخلفية ،..........  
android studio launcher logo
بعد الإنتهاء من تصميم الأيقونة إضغط Next ثم Finish

مكان هذه الأيقونات فى ملف مشروع التطبيق

بعد تركيب الأيقونة ستلاحظ أنها مدرجة فى ملف mipmap بخمس قياسات يمكن معاينتها بالضغط عليها كالمثال التالى:
android studio launcher icon
والآن يمكنك معاينة شكل الأيقونة على هاتفك مباشرة أو من خلال المحاكى.
أتمنى أن أكون وُفقت فى الشرح و لا تنسى مشاركة الموضوع
تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا

2016-11-22

تحويل أى موقع ويب إلى تطبيق أندرويد ببرنامج Android studio

بسم الله الرحمن الرحيم

والصلاة والسلام على أشرف المرسلين

سيدنا محمد وعلى آله وصحبه أجمعين

   بعد أن أصبح إستخدام الهواتف الذكية فى إزدياد مستمر ، فإنه من الضرورى أن يكون لموقعك تطبيق يعمل على زيادة متابعى موقعك من خلال الموبايل ، وهناك العديد من المواقع التى تقدم خدمة تحويل المواقع والمدونات إلى تطبيقات بدون برمجة  ،ولكن  غالبًا ما تكون إمكانياتها المجانية محدودة ، لذلك سأقدم فى هذا الموضوع شرح لكيفية إنشاء تطبيق أندرويد بسيط لأى موقع ويب بإستخدام برنامج أندرويد ستوديو  Android studio ،ولكن قبل أن تبدأ فى الخطوات تأكد من أن موقعك متجاوب ليعمل جيدًا من خلال الهاتف.

Webview android app

الخطوة الأولى: إنشاء مشروع جديد ببرنامج أندرويد ستوديو

1- فتح مشروع جديد بإستخدام برنامج أندرويد ستوديو File > New Project
2- أكتب إسم التطبيق و الـ Package
فى هذا المشروع إخترت إسم WebView
 Package:   com.condaianllkhir.httpwww.webview
 ثم إختر Minimum SDK ثم إضغط Next
3- من النافذة التالية إختر Empty activity ثم Next ثم Finish

الخطوة الثانية : إضافة الأكواد إلى المشروع

إضافة الأكواد البرمجية ستكون فى الثلاث ملفات الموجودين بالمشروع على يسار البرنامج كما بالصورة
android studio tuts
إنسخ الأكواد التالية وإستبدلها بالأكواد الموجودة بكل ملف على حده :

ملف : AndroidManifest.xml

 ستجده فى هذا المسار:  App > Manifests > AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.condaianllkhir.httpwww.webview">
        android:versionCode="1"
        android:versionName="1.0" >

        <uses-sdk
            android:minSdkVersion="8"
            android:targetSdkVersion="23" />

        <uses-permission android:name="android.permission.INTERNET" />
        <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
        <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>
**الأكواد الملونة باللون الأحمر: تعطى صلاحية إتصال التطبيق بالإنترنت

ملف : activity_main.xml

  ستجده فى هذا المسار: app\src\main\res\layout\activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:paddingBottom="5dp"
    android:paddingLeft="5dp"
    android:paddingRight="5dp"
    android:paddingTop="5dp"
    android:orientation="vertical"
    android:gravity="center_horizontal|center_vertical"
    tools:context="com.condaianllkhir.httpwww.webview.MainActivity">

    <WebView
        android:id="@+id/webView"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

    <LinearLayout
        android:id="@+id/layoutProgress"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
        android:gravity="center_horizontal|center_vertical" >

        <ProgressBar
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@+id/progressBar"
            style="?android:attr/progressBarStyleLarge"
            android:layout_gravity="center_vertical" />
    </LinearLayout>

</FrameLayout>
**هذا الكود المسئول عن تصميم واجهة التطبيق

ملف: MainActivity.java

ستجده فى هذا المسار: app\src\main\java\com.condaianllkhir.httpwww.webview\MainActivity.java

package com.condaianllkhir.httpwww.webview;
        import android.content.Context;
        import android.graphics.Bitmap;
        import android.net.ConnectivityManager;
        import android.net.NetworkInfo;
        import android.support.v7.app.AppCompatActivity;
        import android.os.Bundle;
        import android.view.KeyEvent;
        import android.view.View;
        import android.webkit.WebSettings;
        import android.webkit.WebView;
        import android.webkit.WebViewClient;
        import android.widget.LinearLayout;
        import android.widget.ProgressBar;
        import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
    private WebView webView;
    private ProgressBar progressBar;
    private LinearLayout layoutProgress;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        webView = (WebView) findViewById(R.id.webView);
        progressBar = (ProgressBar) findViewById(R.id.progressBar);
        layoutProgress = (LinearLayout) findViewById(R.id.layoutProgress);
        webView.setVisibility(View.GONE);
        WebSettings settings = webView.getSettings();
        settings.setJavaScriptEnabled(true);
        settings.setBuiltInZoomControls(true);
        settings.setSupportZoom(true);
        settings.setDisplayZoomControls(false);
        webView.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return true;
            }

            @Override
            public void onPageFinished(WebView view, String url) {
                webView.setVisibility(View.VISIBLE);
                layoutProgress.setVisibility(View.GONE);
                progressBar.setIndeterminate(false);
                super.onPageFinished(view, url);

            }

            @Override
            public void onPageStarted(WebView view, String url, Bitmap favicon) {
                layoutProgress.setVisibility(View.VISIBLE);
                progressBar.setIndeterminate(true);
                super.onPageStarted(view, url, favicon);
            }
        });
        if(isOnline()) {
            webView.loadUrl("http://www.condaianllkhir.com/");
        } else {
            String summary = "<html><body><font color='red'>No Internet Connection</font></body></html>";
            webView.loadData(summary, "text/html", null);
            toast("No Internet Connection.");
        }
    }
    private void toast(String message) {
        Toast.makeText(this, message, Toast.LENGTH_LONG).show();
    }

    private boolean isOnline() {
        ConnectivityManager cm = (ConnectivityManager) getSystemService(Context.CONNECTIVITY_SERVICE);
        NetworkInfo netInfo = cm.getActiveNetworkInfo();
        return (netInfo != null && netInfo.isConnected());
    }

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack()) {
            webView.goBack(); // Go to previous page
            return true;
        }
        // Use this as else part
        return super.onKeyDown(keyCode, event);
    }

    }

** لا تنسى تغيير الرابط الملون باللون الأخضر برابط موقعك .
**هذا الكود بلغة الــ JAVA وهو المسئول عن بعض الأوامر منها :
  •  فتح الموقع من خلال التطبيق 
  • السماح بالتكبير والتصغير
  • السماح بتصفح الموقع من خلال التطبيق بدون الخروج لمتصفح خارجى
  •  تفعيل زر الرجوع للخلف بحيث يمكن الرجوع للصفحات التى تم زيارتها بدون الخروج من التطبيق.
لا يبقى سوى إختبار ومعاينة التطبيق عبر الهاتف أو المحاكى .
تعرف أيضًا على كيفية تغيير أيقونة التطبيق و إضافة شاشة بدء أو مقدمة للتطبيق Splash Screen
تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا

2016-11-14

كيفية إختبار مشروعك على أندرويد ستوديو بمحاكى Genymotion

بسم الله الرحمن الرحيم

والصلاة والسلام على أشرف المرسلين

سيدنا محمد وعلى آله وصحبه أجمعين

من الضرورى أن تقوم بمعاينة التطبيق الذى قمت بتطويره ببرنامج Android studio قبل نشره حتى تتأكد من إنه يعمل جيدًا وأنه يخلو من الأخطاء البرمجية ، لذلك شرحت بموضوعات سابقة عدة طرق لتجربة التطبيقات وهى:
  1. معاينة التطبيق على محاكى أندرويد استوديو الإفتراضى AVD
  2. تجربة تطبيقك المطور ببرنامج أندرويد ستوديو على هاتفك مباشرة
  3. تجربة التطبيق على محاكى جينى موشن  Genymotion
Genymotion

لماذا أنصح بإستخدام محاكى Genymotion ؟

  1. يتميز بأنه أسرع وأخف بصورة كبيرة بالمقارنة مع المحاكى الإفتراضى AVD
  2. به إمكانية تغيير حجم شاشة الجهاز الوهمى الذى يعمل بمحاكى Genymotion 
  3. إمكانية إنشاء أجهزة متعددة، بإصدارات مختلفة لنظام الأندرويد.
  4. يمكن التحكم فى أداء البطارية ، GPS ،  ....إلخ
  5. أحيانًا نحتاج إلى تجربة التطبيق على أكثر من جهاز فى وقت واحد مثل تطبيقات الشات، فيمكن إستخدام جينى موشن إيميوليتور كجهاز إضافى بجانب المحاكى الإفتراضى AVD.
  6. مجانى للإستخدام الشخصى.
  7. سهل التثبيت ، يدعم أنظمة Mac , windows , linux

عيوب Genymotion:

 لا يدعم خدمات جوجل مثل Google maps,Google play store , .......... و لكن إذا كان تطبيقك يحتاج إلى هذه الخدمات يمكن تثبيتها ودمجها مع المحاكى .

أولا: تثبيت محاكى جينى موشن Genymotion emulator

1- فى البداية توجه إلى موقع البرنامج الرسمى وقم بإنشاء حساب مجانى
2- قم بتحميل النسخة المجانية الكاملة بحسب نظام  حاسوبك. (with VirtualBox)
Genymotion
3- بعد تمام التنزيل قم بتثبيته على جهازك كأى برنامج آخر  ( سيطلب منك أثناء التثبيت أيضًا تثبيت Oracle Virtualbox) قم بتثبيته ومتابعة الخطوات حتى إنهاء العملية.

ثانيًا: إنشاء جهاز جديد  "virtual device" على محاكى Genymotion 

4- إضغط أيقونة برنامج Genymotion على سطح المكتب (قد يطلب منك تسجيل الدخول بحسابك الذى قمت بإنشاؤه فى الخطوة الأولى) ثم إضغط على زر "Add" أعلى نافذة البرنامج.
Genymotion setup
 5- ستظهر لك قائمة كبيرة من أجهزة الأندرويد بإصدارات مختلفة ، قم بإختيار أى جهاز تريده ثم إضغط Next حتى يتم تحميل الجهاز الذى إخترته >> بعد ذلك إضغط Finish
Genymotion setup

ثالثًا: ربط محاكى Genymotion مع برنامج  Android studio

7- إذهب إلى برنامج أندرويد أستوديو  وتوجه إلى File > Settings > Plugins
ثم إضغط على زر Browse Repositories
ثم اكتب بالبحث Genymotion واضغط عليها 
Genymotion installation

8- قم بتثبيت إضافة Genymotion Plugin بالضغط على Install plugin وإنتظر التحميل
Genymotion installation
9- قم بغلق برنامج أندرويد ستوديو وإعادة تشغيله لتفعيل الإضافة.

رابعًا: كيفية إختبار التطبيق على محاكى Genymotion:

 قم بتشغيل محاكى Genymotion وإفتح من خلاله الجهاز الذى تريده من خلال الضغط على زر Start
 Genymotion installation
سيظهر لك جهاز وهمى  Virtual Device الذى ستقوم بإختبار التطبيق عليه.
Genymotion virtual device

 ثم أفتح مشروعك على اندرويد استديو واضغط على Run  
ستظهر لك نافذة بها إسم الجهاز المفتوح بالجينى موشن , قم بإختياره وإنتظر قليلا حتى تتمكن من تجربة تطبيقك عليه.

أتمنى لكم التوفيق.... وأى مشكلة أكتبها بتعليق
تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا

2016-11-07

كيفية صنع شاشة بدء أو مقدمة لتطبيق أندرويد splash screen

بسم الله الرحمن الرحيم

والصلاة والسلام على أشرف المرسلين

سيدنا محمد وعلى آله وصحبه أجمعين

لكى تصل تطبيقاتك إلى الإحترافية ، يكون من الأفضل أن تبدأ بمقدمة تظهر مع بداية فتح التطبيق تحتوى على شعار خاص بالتطبيق، هذه المقدمة تسمى الشاشة المتلاشية أو Splash screen ، وفى هذا الموضوع سأعرض كيفية إنشاء مقدمة بسيطة بإستخدام برنامج   Android Studio مع شرح الأكواد وإليك الخطوات :
splash screen

الخطوة الأولى : بدء مشروع جديد

1- فتح مشروع جديد بإستخدام برنامج أندرويد ستوديو File > New Project (راجع كيف تبدأ إنشاء تطبيق أندرويد
2- أكتب إسم التطبيق و إختر Minimum SDK ثم إضغط Next
3- من النافذة التالية إختر Empty activity ثم Next ثم Finish

الخطوة الثانية : إدراج صورة مناسبة كمقدمة للتطبيق

4- تجهيز صورة لإستخدامها كشاشة بدء بصيغة jpeg أو png وبأبعاد  800×1280
5- قم بتسمية هذه الصورة splash_image
6- قم بنسخ هذه الصورة ولصقها داخل ملف drawable الموجود بالتطبيق كما بالصورة
android studio Tutorials

7- ثم من خلال ملفات التطبيق إضغط كليك يمين على ملف Layout كما بالصورة
Layout >>New>>Layout resource file
android studio Tutorials
8- قم بتسمية الملف  splash.xml ثم إضغط OK
android studio Tutorials
وإنسخ بتبويب Text لملف splash.xml الكود التالى:
هذا الكود خاص بأبعاد الصورة

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

</LinearLayout>
android studio Tutorials

الخطوة الثالثة: أضف أكواد الجافا

9- إذهب إلى ملف java داخل ملفات التطبيق ثم إختر الــ package الخاص بتطبيقك وإضغط عليه كليك يمين ثم إختر New >>Java Class
android studio Tutorials
وقم بتسميته SplashScreen
android studio Tutorials
 10-ثم إنسخ الكود التالى وقم بلصقه بتبويب Text لــ SplashScreen
package com.condaianllkhir.httpwww.splash;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;

/**
 * Created by DrRO on 7-Nov-16.
 */
public class SplashScreen extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        setContentView(R.layout.splash);

        Thread timerThread = new Thread(){
            public void run(){
                try{
                    sleep(3000);
                }catch(InterruptedException e){
                    e.printStackTrace();
                }finally{
                    Intent intent = new Intent(SplashScreen.this,MainActivity.class);
                    startActivity(intent);
                }
            }
        };
        timerThread.start();
    }

    @Override
    protected void onPause() {
        // TODO Auto-generated method stub
        super.onPause();
        finish();
    }

}
إستبدل السطر الملون باللون الأحمر بإسم الــ package الخاص بك
** فائدة هذا الكود  أنه يؤدى إلى توقف عمل الشاشة المتلاشية بعد فترة محددة ولا يسمح للعودة مرة أخرى إلى هذه الشاشة المتلاشية إذا ضغط المستخدم زر back

 الخطوة الرابعة :إضافة SplashScreen Activity إلى ملف AndroidManifest.xml

11- قم بفتح مجلد التطبيق وتوجه إلى ملف AndroidManifest.xml كما بالصورة
App > Manifests > AndroidManifest.xml
android studio Tutorials
ثم إنسخ الكود التالى بملف AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
 package="com.condaianllkhir.httpwww.splash" >

 <application
 android:allowBackup="true"
 android:icon="@mipmap/ic_launcher"
 android:label="@string/app_name"
 android:theme="@style/AppTheme" >

 <activity
 android:name=".SplashScreen"
 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=".MainActivity"
 android:label="@string/app_name" >
 <intent-filter>
 <action android:name="com.condaianllkhir.httpwww.splash" />

 <category android:name="android.intent.category.DEFAULT" />
 </intent-filter>
 </activity>
 </application>

</manifest>
إستبدل السطور الملونة باللون الأحمر بإسم الــ package الخاص بك
** فائدة هذا الكود : لابد من إضافة SplashScreen Activity إلى ملف AndroidManifest.xml ليتم التعرف عليها و بدء التطبيق بالشاشة المتلاشية

الخطوة الخامسة: معاينة التطبيق

بذلك نكون قد أتممنا إنشاء الـشاشة المتلاشية ويمكن معاينتها بإستخدام المحاكى أو على الهاتف مباشرة

مصدر الأكواد المستخدمة بالشرح coderefer
تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا

2016-10-24

تجربة تطبيقك المطور ببرنامج أندرويد ستوديو على هاتفك مباشرة

بسم الله الرحمن الرحيم

والصلاة والسلام على أشرف المرسلين

سيدنا محمد وعلى آله وصحبه أجمعين

إذا أردت معاينة تطبيق قمت بصناعته ببرنامج أندرويد أستوديو فهناك عدة طرق للقيام بذلك ، وقد ناقشت فى موضوع سابق كيفية إختبار التطبيق على المحاكى الإفتراضى للبرنامج Android Emulator AVD من خلال جهاز الكمبيوتر ، ولكن إذا واجهتك صعوبة فى إستخدام المحاكى فيمكن الإعتماد على الطريقة التالية وهى تجربة التطبيق على جهاز الأندرويد (هاتف/تابلت/....) مباشرة وهى تعتبر أسرع طريقة لمعاينة التطبيق.

Android Studio Tutorials

ولتطبيق ذلك يحتاج إلى ضبط لبعض الإعدادات سواء بالنسبة للهاتف أو الكمبيوتر أو برنامج أندرويد ستوديو:

أولًا :بالنسبة لجهاز الأندرويد >>  تفعيل خاصية USB Debugging

نحتاج إلى تفعيل هذه الخاصية من إعدادات المطور حتى نتمكن من التحكم فى الهاتف من خلال جهاز الكمبيوتر ، وتختلف كيفية تفعيلها على حسب نوع إصدار نظام الأندرويد:

الأجهزة التى تعمل بإصدار V3.2  أو قدم :

إذهب إلى إعدادات الجهاز كما بالصورة
Settings –> Applications –> Development
USB Debugging

ثم قم بتفعيل USB Debugging

الأجهزة التى تعمل بإصدار V4.0   أوأحدث

فى هذه الإصدارات تكون إعدادات المطور مخفية ولإظهارها إذهب إلى إعدادات الجهاز
Settings –> About Phone –> Build Number
إضغط على Build Number سبع مرات ثم إرجع إلى قائمة الإعدادات، ستلاحظ ظهور قائمة خيارات المطور Developer options التى يمكن من خلالها تفعيل USB Debugging
USB Debugging

ثانيًا: بالنسبة لبرنامج Android studio

هذا الشرح لنظام الويندوز فقط (بالنسبة بنظام ماك يعمل تلقائى بدون الخطوات التالية)
1- إذهب إلى SDK Manger من خلال شريط الأدوات كما بالصورة
SDK Manager
2 -ثم قم بتحميل Google USB Driver  بالضغط على install pakage
SDK Manager
بعد تمام التحميل قم بغلق نافذة SDK Manger 

ثالثًا : بالنسبة لجهاز الكمبيوتر (نظام الويندوز) :

1- قم بتوصيل الهاتف بالكمبيوتر بإستخدام كابل usb
2- من خلال كليك يمين على my computer (ويندوز 7 أو 8)
إختر Manage ثم Device manger
ثم من خلال القائمة لاحظ وجود إسم هاتفك ضمن Portable Devices
Device Manager


3- إضغط كليك يمين على إسم هاتفك ثم إضغط "Browse my computer for driver software"
Browse my computer for driver software


4- ثم أضف هذا المسار كما بالصورة مع إستبدال user name بإسم المستخدم الخاص بك

C:\Users\UserName\AppData\Local\Android\sdk\extras\google\usb_driver

Browse my computer for driver software
5- ثم إضغط Next ثم Finish
الآن يمكن لبرنامج Android studio أن يتعرف على جهازك

رابعًا: معاينة التطبيق على جهاز الأندرويد:


تأكد من إتمام جميع الخطوات السابقة ثم إفتح مشروع التطبيق الذى تريد تجربته من خلال برنامج أندرويد ستوديو وإضغط Run من شريط الأدوات
لتظهر نافذة بها جهاز الهاتف الخاص بك>>> إضغط عليه ثم إضغط OK
Test Android App

الآن يمكنك معاينة تطبيقك على جهاز الهاتف مباشرة.

إقرأ أيضًا: كيفية إنشاء تطبيق أندرويد بإستخدام Android studio

تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا

2016-10-16

كيفية معاينة تطبيقك على أندرويد استوديو خلال المحاكى AVD

بسم الله الرحمن الرحيم

والصلاة والسلام على أشرف المرسلين

سيدنا محمد وعلى آله وصحبه أجمعين

ما هى المحاكى Android Emulator  ؟

المحاكى هو جهاز أندرويد إفتراضى يعمل على جهاز الكمبيوتر ، يمكن من خلاله إختبار و تشغيل التطبيقات التى قمت بتطويرها للتأكد من انها تعمل بشكل صحيح دون الحاجة إلى هاتف أو تابلت حقيقى ، و تكون هذه المحاكى مفيدة فى حالة عدم وجود جهاز أندرويد لديك أو فى حالة إذا أردت تجربة التطبيق على أكثر من نوع جهاز .
لذلك سأقوم بشرح كيفية تفعيل المحاكى الإفتراضى لبرنامج أندرويد استوديو  (ADV)  Android Virtual Device
android-studio-preview
ولكن قبل أن تبدأ فى إنشاء هذه المحاكى تعرف أولا على مميزاتها وعيوبها:

المميزات:

  1. يدعم خدمات متجر جوجل Google play  الأخرى.
  2. دائمًا يدعم أحدث إصدارات نظام الأندرويد .
  3. إذا أردت تجربة التطبيق على أكثر من جهاز.

العيوب: 

  1. تحتاج إلى جهاز ذات مواصفات عالية.
  2. بطء جهاز الكمبيوتر عند إستخدامها.
  3. تستهلك مساحة كبيرة من ذاكرة جهاز الكمبيوتر. 
إذا كانت هذه العيوب تسبب لك مشكلة فيمكن تجربة التطبيق من خلال هاتفك مباشرة بالكابل USB

خطوات إنشاء محاكى إفتراضى فى برنامج Android studio

1- من شريط الأدوات العلوى ...إضغط على أيقونة  AVD Manager كما بالصورة
android studio
2- ستظهر هذه النافذة.......... إضغط  Create virtual Device
android studio
3 - بعد ذلك ستظهر لك النافذة التالية ........... إختر منها نوع الجهاز (موبايل أو تابلت أو............) الذى تريد تجربة التطبيق عليه وحجم الشاشة ثم اضغط Next
android studio
4- النافذة التالية إختر إصدار الأندرويد الذى تريد تجربة التطبيق عليه، إذا لم لديك إضغط Download لتحميل الإصدار الذى تريده ثم اضغط Next
android studio
5-بعد ذلك يمكن ضبط إعدادات جهاز المحاكى الذى قمت بإنشاؤه من خلال النافذة التالية ولمزيد من الإعدادات إضغط show Advanced setting
android studio
ولكى يعمل تطبيقك على نطاق واسع ولأكبر عدد من الأجهزة قم بتعديل الإعدادات إلى أقل الإمكانيات التى يمكن أن يعمل عليها التطبيق ( مثلا تغيير قيم RAM إلى 500 MB ، المساحة التخزينية الداخلية إلى 200 MB )
android studio
بعد ذلك إضغط Finish ليظهر جهاز المحاكى بالقائمة التالية
android studio

كيفية إختبار التطبيق بإستخدام محاكى أندرويد أستوديو (ADV) 

1- قم بفتح التطبيق الذى تريد تجربته ببرنامج أندرويد أستوديو ثم إضغط على أيقونة التشغيل فى شريط الأدوات العلوى
2- قم بإختيار جهاز المحاكى الذى أنشأته من القائمة
android studio
وبذلك سيتم عمل التطبيق كما لو كان على جهاز أندرويد حقيقى.
تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا
Privacy-Policy | عودة الى الاعلى
جميع الحقوق محفوظة لــ كن داعيا للخير 2011-2016 ©

تصميم كن مدون