آموزش ساخت اپلیکیشن های تک صفحه ای در زامارين

ساخت اپلیکیش های تک صف ای Xamarin.Forms

درVisual Studio 2019

دانلودsample

دانلود sample در این بخش شما یاد میگیرید چگونه:

• یک اپلیکیشن cross-platform با Xamarin.Forms بسازید.
• برای صفحه ای که با eXtensible Application Markup Language (XAML) ساخته شده است، UI بسازید.
• با اجزا XAML UI از طریق کد، ارتباط برقرار کنید.

این بخش به شما می آموزد یک اپلیکیشن cross-platform با Xamarin.Forms بسازید که به شما جازه میدهد یک یادداشت را وارد کرده و آن را در حافظه گوشی حفظ کنید، اپلیکیشن نهایی به شکل زیر خواهد بود:

نیازمندی ها :

• Visual Studio 2019 که Mobile development with .NET روی آن نصب شده باشد.
• آشنایی با C#
• (اختیاری) یک دستگاه مک برای ساخت اپلیکیشن برای iOS

برای اطلاعات بیشتر درباره موارد بالا میتوانید مطالب قبلی را مطالعه کنید.

شروع کار با Visual Studio 2019

１. از منو start، Visual Studio 2019 را باز کنید و برای ایجاد پروژه جدید، Create a new project را انتخاب کنید:

２. در پنجره ساخت پروژه جدید، Mobile را در منوProject type انتخاب کنید، Mobile App (Xamarin.Forms) را انتخاب کنید و دکمه Next را بزنید:

３. در پنجره Configure your new project ، نام پروژه را Notes بگذارید. مکان مناسب ذخیره پروژه را انتخاب کنید و دکمه Create را بزنید:

４. در دیالوگ New Cross Platform App، Blank App را انتخاب کرده و OK را کلیک کنید:

برای اطلاعات بیشتر درباره .NET Standard Library، Anatomy of a Xamarin.Forms application را در Xamarin.Forms Quickstart Deep Dive مطالعه کنید

５. در پروژه Notes، در Solution Explorer ، MainPage.xaml را با دابل کلیک باز کنید:

６. تمام کد های موجود را در MainPage.xaml پاک کنید و کد زیر را جایگزین کنید:

    
    
        
            
            
            
                
                    
                    
                
                
                
            
        
    
}   

این کد UI صفحه را تعریف میکند، از یک Lable برای نمایش text، یک Editor برای وارد کردن text و دو Button برای حذف یا ذخیره فایل، تشکیل شده است. دو Button به صورت افقی در یک Grid با یک Lable و یک Editor قرار داده شده اند که به شکل عمودی در یک StackLayout قرار دارند. برای اطلاعات بیشتر درباره ایجاد UI، بخش User Interface را در Xamarin.Forms Quickstart Deep Dive مطالعه کنید. تغییرات را در MainPage.xaml با فشردن CTRL+S، ذخیره کنید.

７. در پروژه Notes، در Solution Explorer، MainPage.xaml را باز کنید و روی MainPage.xaml.cs دابل کلیک کنید تا بازشود:

８. در MainPage.xamlcs تمام کد های موجود را پاک کنید و کد زیر را جایگزین کنید:

    using System;
    using System.IO;
    using Xamarin.Forms;
    
    namespace Notes
    {
        public partial class MainPage : ContentPage
        {
            string _fileName = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "notes.txt");
    
            public MainPage()
            {
                InitializeComponent();
    
                if (File.Exists(_fileName))
                {
                    editor.Text = File.ReadAllText(_fileName);
                }
            }
    
            void OnSaveButtonClicked(object sender, EventArgs e)
            {
                File.WriteAllText(_fileName, editor.Text);
            }
    
            void OnDeleteButtonClicked(object sender, EventArgs e)
            {
                if (File.Exists(_fileName))
                {
                    File.Delete(_fileName);
                }
                editor.Text = string.Empty;
            }
        }
    }
}   

این کد فیلد –fileName را مشخص میکند، که یک رفرنس از یک فایل که notes.txt نام گذاری شده است میباشد که دیتا note را در پوشه مربوط به اپلیکیشن ذخیره میکند. زمانی که page constructor اجرا شود، فایل خوانده میشود، در صورت وجود، و در editor نمایش داده میشود. زمانی که دکمهSave زده شود، event handler، OnSaveButtonClicked اجرا میشود. زمانی که دکمه Delete زده شود، event handler، OnDeleteButtonClicked اجرا میشود و هر متن موجود در editor را پاک میکند. برای اطلاعات بیشتر Responding to user interaction را مطالعه کنید.

Binding the Quickstart

１. در Visual Studio به منو Build>Build sulotion بروید( یا F6 را بزنید). Solution ساخته شده و یک پیام در visual studio status bar ظاهر میشود

اگر اروری وجود داشت، گام های قبلی را انجام دهید تا build ساخته شود.

２. در toolbar موجود در visual studio، منو start (که شکل مثلثی مانند دکمه play دارد) را بزنید تا اپلیکیشن در شبیه ساز انتخابی شما اجرا شود:

متنی وارد کنید و save را انتخاب کنید.

برای اطلاعات بیشتر درباره چگونگی ایجاد اپلیکیشن در پلتفرم های مختلف، Launching the application on each platform را مطالعه کنید.

３. در visual studio toolbar بر روی Notes.iOS راست کلیک کنید و Set as StartUp Project را انتخاب کنید:

４. در visual studio toolbar، start را بزنید تا اپلیکیشن در شبیه ساز iOS انخابی شما، اجرا شود:

یک متن وارد کنید و save را بزنید.

برای اطلاعات بیشتر درباره چگونگی اجرا اپلیکیشن در پلتفرم های مختلفLaunching the application on each platform را مطالعه کنید.

درVisual Studio 2017

دانلودsample

در این مقاله شما می آموزید چگونه:

• یک اپلیکیشن cross-platform با Xamarin.Forms بسازید.
• برای صفحه ای که با eXtensible Application Markup Language (XAML) ساخته شده است، UI بسازید.
• با اجزا XAML UI از طریق کد، ارتباط برقرار کنید.

]

این بخش به شما می آموزد یک اپلیکیشن cross-platform با Xamarin.Forms بسازید که به شما جازه میدهد یک یادداشت را وارد کرده و آن را در حافظه گوشی حفظ کنید، اپلیکیشن نهایی به شکل زیر خواهد بود:

نیازمندی ها :

• Visual Studio 2017 که Mobile development with .NET روی آن نصب شده باشد.
• آشنایی با C#
• (اختیاری) یک دستگاه مک برای ساخت اپلیکیشن برای iOS

برای اطلاعات بیشتر درباره موارد بالا میتوانید مطالب قبلی را مطالعه کنید.

شروع کار با Visual Studio 2017

１. Visual Studio 2017 را باز کنید و در صفحه شروع Create new project… را انتخاب کنید تا یک پروژه جدید ایجاد شود:

２. در بخش New Project، Cross-platform را انتخاب کنید، سپس Mobile App (Xamarin.Forms) را انتخاب کنید. نام پروژه را Notes بگذارید و مکان مناسب برای ذخیره برنامه را انتخاب کنید و OK را بزنید:

>

３. در New Cross Platform App، Blank App را انتخاب کنید، در بخش code sharing strategy، .NET Standard را انتخاب کنید و OK را بزنید:

برای اطلاعات بیشتر درباره .NET Standard Library،Anatomy of a Xamarin.Forms application را در Xamarin.Forms Quickstart Deep Dive مطالعه کنید.

４. در بخش Solution Explorer در پروژه Notes، بر MainPage.xaml دابل کلیک کنید تا باز شود:

５. در MainPage.xaml تمام کد های موجود را پاک کنید و کد زیر را جایگزین کنید:

این کد UI صفحه را تعریف میکند، از یک Lable برای نمایش text، یک Editor برای وارد کردن text و دو Button برای حذف یا ذخیره فایل، تشکیل شده است. دو Button به صورت افقی در یک Grid با یک Lable و یک Editor قرار داده شده اند که به شکل عمودی در یک StackLayout قرار دارند. برای اطلاعات بیشتر درباره ایجاد UI، بخش User Interface را در Xamarin.Forms Quickstart Deep Dive مطالعه کنید.

６. در پروژه Notes در Solution Explorer، MainPage.xaml را باز کنید و بر MainPage.xaml.cs دابل کلیک کنید تا باز شود:

７. تمام کد های موجود را در MainPage.xaml.cs پاک کنید و کد زیر را جایگزین کنید:

    using System;
    using System.IO;
    using Xamarin.Forms;
    
    namespace Notes
    {
        public partial class MainPage : ContentPage
        {
            string _fileName = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "notes.txt");
    
            public MainPage()
            {
                InitializeComponent();
    
                if (File.Exists(_fileName))
                {
                    editor.Text = File.ReadAllText(_fileName);
                }
            }
    
            void OnSaveButtonClicked(object sender, EventArgs e)
            {
                File.WriteAllText(_fileName, editor.Text);
            }
    
            void OnDeleteButtonClicked(object sender, EventArgs e)
            {
                if (File.Exists(_fileName))
                {
                    File.Delete(_fileName);
                }
                editor.Text = string.Empty;
            }
        }
    }

این کد فیلد –fileName را مشخص میکند، که یک رفرنس از یک فایل که notes.txt نام گذاری شده است میباشد که دیتا note را در پوشه مربوط به اپلیکیشن ذخیره میکند. زمانی که page constructor اجرا شود، فایل خوانده میشود، در صورت وجود، و در editor نمایش داده میشود. زمانی که دکمهSave زده شود، event handler، OnSaveButtonClicked اجرا میشود. زمانی که دکمه Delete زده شود، event handler، OnDeleteButtonClicked اجرا میشود و هر متن موجود در editor را پاک میکند. برای اطلاعات بیشتر Responding to user interaction را مطالعه کنید.

تغییرات را ذخیره کنید و فایل را ببندید.

>

Binding the Quickstart

１. در Visual Studio به منو Build>Build sulotion بروید( یا F6 را بزنید). Solution ساخته شده و یک پیام در visual studio status bar ظاهر میشود :

اگر اروری وجود داشت، گام های قبلی را انجام دهید تا build ساخته شود.

２. در toolbar موجود در visual studio، منو start (که شکل مثلثی مانند دکمه play دارد) را بزنید تا اپلیکیشن در شبیه ساز انتخابی شما اجرا شود:

متنی وارد کنید و save را انتخاب کنید.

برای اطلاعات بیشتر درباره چگونگی ایجاد اپلیکیشن در پلتفرم های مختلف، Launching the application on each platform را مطالعه کنید.

３. در visual studio toolbar بر روی Notes.iOS راست کلیک کنید و Set as StartUp Project را انتخاب کنید:

４. در visual studio toolbar، start را بزنید تا اپلیکیشن در شبیه ساز iOS انخابی شما، اجرا شود:

یک متن وارد کنید و save را بزنید.

برای اطلاعات بیشتر درباره چگونگی اجرا اپلیکیشن در پلتفرم های مختلف Launching the application on each platform را مطالعه کنید.

در Visual Studio for Mac

دانلودsample

در این مقاله شما می آموزید چگونه:

• یک اپلیکیشن cross-platform با Xamarin.Forms بسازید.
• برای صفحه ای که با eXtensible Application Markup Language (XAML) ساخته شده است، UI بسازید.
• با اجزا XAML UI از طریق کد، ارتباط برقرار کنید.

این بخش به شما می آموزد یک اپلیکیشن cross-platform با Xamarin.Forms بسازید که به شما جازه میدهد یک یادداشت را وارد کرده و آن را در حافظه گوشی حفظ کنید، اپلیکیشن نهایی به شکل زیر خواهد بود:

نیازمندی ها :

• Visual Studio for Mac که iOS and Android platform support روی آن نصب شده باشد.
• آخرین ورژن Xcode
• آشنایی با C#

برای اطلاعات بیشتر درباره موارد بالا میتوانید مطالب قبلی را مطالعه کنید.

شروع کار با Visual Studio for Mac

1. Visual Studio for Mac را باز کنید و New را کلیک کنید تا یک پروژه جدید ایجاد شود:

2. در بخش Choose a template for your new project، به Multiplatform>App بروید، Blank Forms App را انتخاب کنید و Next را بزنید:

3. در Configure your Blank Forms App، اپ جدید خود را Notes نام گذاری کنید و مطمئن شوید که Use .NET Standard را انتخاب کرده اید و سپس Next را بزنید:

4. در بخش Configure your new Blank Forms App، Solution name و Project name را Notes بگذارید، مکان مناسب برای ذخیره فایل را انتخاب کنید و دکمه Create را بزنید تا پروژه ایجاد شود:

５. در Solution Pad در پروژه Notes، روی MainPage.xaml دابل کلیک کنید تا باز شود:

６. در MainPage.xaml، تمام کد های موجود را پاک کنید و کد زیر را جایگزین کنید:

این کد UI صفحه را تعریف میکند، از یک Lable برای نمایش text، یک Editor برای وارد کردن text و دو Button برای حذف یا ذخیره فایل، تشکیل شده است. دو Button به صورت افقی در یک Grid با یک Lable و یک Editor قرار داده شده اند که به شکل عمودی در یک StackLayout قرار دارند. برای اطلاعات بیشتر درباره ایجاد UI، بخش User Interface را درXamarin.Forms Quickstart Deep Dive مطالعه کنید.

７. در Solution Pad در پروژه Notes، MainPage.xaml را باز کنید و روی MainPage.xaml.cs دابل کلیک کنید تا باز شود:

８. در MainPage.xaml.cs ، تمام کد های موجود را پاک کنید و کد زیر را جایگزین کنید:

    using System;
    using System.IO;
    using Xamarin.Forms;
    
    namespace Notes
    {
        public partial class MainPage : ContentPage
        {
            string _fileName = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "notes.txt");
    
            public MainPage()
            {
                InitializeComponent();
    
                if (File.Exists(_fileName))
                {
                    editor.Text = File.ReadAllText(_fileName);
                }
            }
    
            void OnSaveButtonClicked(object sender, EventArgs e)
            {
                File.WriteAllText(_fileName, editor.Text);
            }
    
            void OnDeleteButtonClicked(object sender, EventArgs e)
            {
                if (File.Exists(_fileName))
                {
                    File.Delete(_fileName);
                }
                editor.Text = string.Empty;
            }
        }
    }

این کد فیلد –fileName را مشخص میکند، که یک رفرنس از یک فایل که notes.txt نام گذاری شده است میباشد که دیتا note را در پوشه مربوط به اپلیکیشن ذخیره میکند. زمانی که page constructor اجرا شود، فایل خوانده میشود، در صورت وجود، و در editor نمایش داده میشود. زمانی که دکمهSave زده شود، event handler، OnSaveButtonClicked اجرا میشود. زمانی که دکمه Delete زده شود، event handler، OnDeleteButtonClicked اجرا میشود و هر متن موجود در editor را پاک میکند. برای اطلاعات بیشترResponding to user interaction را مطالعه کنید.

تغییرات ایجاد شده در MainPage.xaml را ازFile> Save ذخیره کنید( یا با +S⌘ ( و فایل را ببندید.

Binding the quickstart

１. در Visual Studio for Mac به منو Build> Build All بروید (یا +B ⌘ را بزنید) تا پروژه Build شود و پیام مربوطه در Visual Studio for mac toolbar ظاهر شود:

اگر خطایی وجود داشت مراحل قبل را انتخآب کنید تا پروژه Build شود.

２. در Solution pad ، پروژه Notes.iOS را انتخاب کنید و Set As Startup Project را انتخاب کنید:

３. در Visual Studio for Mac toolbar، start (که یک مثلث شبیه به دکمه play میباشد) را بزنید تا اپلیکیشن در شبیه ساز iOS انتخابی شما اجرا شود:

یک متن وارد کنید و save را بزنید.

برای اطلاعات بیشتر درباره چگونگی ایجاد اپلیکیشن در پلتفرم های مختلف، Launching the application on each platform را مطالعه کنید.

４. در Sulotion pad در پروژه Notes.Android، راست کلیک کنید و Set As Startup Project را انتخاب کنید:

５. در Visual Studio for Mac toolbar، دکمه Start را بزنید تا اپلیکیشن در شبیه ساز اندروید انتخابی شما اجرا شود:

یک متن وارد کنید و save را انتخاب کنید.

برای اطلاعات بیشتر درباره چگونگی ایجاد اپلیکیشن در پلتفرم های مختلف، Launching the application on each platform را مطالعه کنید.