xamarin 강좌 002. xamarin 기본생성 프로젝트의 구조 - 버튼 추가

xamarin 강좌

2018/09/10 - [프로그래밍/xamarin] - xamarin 강좌 001. xamarin의 시작

xamarin 2번쨰 시간으로, 

xamarin을 실행해 만들어지는 프로젝트에서 기본적으로 생성된 파일들을 설명합니다. 

정확히는 공통 부분에 대한 설명이네요. 

이렇게 생긴 솔루션 탐색기에서 보면, 

총 4개의 프로젝트가 생성되었는데,

솔루션 이름인 xa002와 똑같은 이름의 프로젝트,

android용 프로젝트

iOS(아이폰)용 프로젝트

UWP(Windows)용 프로젝트

이렇게 총 4개의 프로젝트가 생성되었습니다. 

이중 솔루션이름과 똑같은 이름의 프로젝트(4개중 맨 위에 있는 프로젝트)에 공용코드가 만들어지게 되고, 3개의 디바이스들이 그 공용코드를 이용해 각자 자기 디바이스에 맞게 빌드해서 자기 디바이스에서 실행됩니다. 

MainPage.xaml과 MainPage.xaml.cs 파일에서 볼 수 있듯이, 

2개의 파일은 이름이 서로 같고,   .cs  가 추가된 것만 다릅니다. 

모든 파일이 이런 식인데요,

이렇게 .xaml 파일은 UI를 구성하는 역할을 하고, 

.xaml.cs 파일은 그 .xaml 파일이 구성한 UI에서 벌어지는 일들을, 기능들을 실제로 구현합니다. 

이렇게 UI와 코드가 분리되도록 설계한 것이지요.

그래서 이번 버튼 예제에서도,

MainPage.xaml 파일에서 버튼을 추가하고,

MainPage.xaml.cs 파일에서 그 버튼을 눌렀을 때 어떤 일을 할지를 구현하고 있습니다. 

이번 프로젝트에서는 2개의 파일을 수정했는데, 

MainPage.xaml 파일과 MainPage.xaml.cs 파일, 이렇게 2개 파일만 수정했습니다. 

각각의 코드는 다음과 같습니다 

---

MainPage.xaml 전체

<?xml version="1.0" encoding="utf-8" ?>

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"

             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"

             xmlns:local="clr-namespace:xa002"

             x:Class="xa002.MainPage">

    <StackLayout>

        <!-- Place new controls here -->

        <Label Text="안녕하세요. xamarin!" 

           HorizontalOptions="Center"

           VerticalOptions="CenterAndExpand" />

        <Button Text="테스트" Clicked="Button_Clicked" />

    </StackLayout>

</ContentPage>

---

MainPage.xaml.cs 전체

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Threading.Tasks;

using Xamarin.Forms;

namespace xa002

{

    public partial class MainPage : ContentPage

    {

        public MainPage()

        {

            InitializeComponent();

        }

        private void Button_Clicked(object sender, EventArgs e)

        {

            System.Diagnostics.Debug.WriteLine("버튼이 눌림!");

        }

    }

}

---

더 자세한 내용은 아래 xamarin 동영상 강좌로 확인하세요