21
자자자 (Xamarin) Hello 자자자자자 자자 자자자자자 , 자자자자자 자자 이이이 , 이이이이이 (www.topcredu.co.kr)

C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

  • Upload
    3-2

  • View
    1.022

  • Download
    8

Embed Size (px)

Citation preview

Page 1: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

자마린 (Xamarin)

Hello 안드로이드 실습이뮬레이터 , 휴대폰에서 실행

이종철 , 탑크리에듀 (www.topcredu.co.kr)

Page 2: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

Hello Android(Xamarin.Android Application)

xamarin.com 의 phoneworld Hello 안드로이드 프로젝트를 따라해 보자 . ( 문자로 입력된 전화번호를 숫자로 변환하고 실제 전화를 거는 응용 앱 )https://developer.xamarin.com/guides/android/getting_started/hello,android/hello,android_quickstart/

설치환경 윈도우 10 64Bit 8G RAM, 비주얼 스튜디오 커뮤니티 2015

실습코드는 http://ojc.asia에서 다운로드 가능 합니다 .

Page 3: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

1. 비주얼 스튜디오를 실행 후 File -> New Project 후 좌측 Template 에서 Android 클릭 후 오른쪽의 Blank App 를 선택하고 , 프로젝트 이름은 “ phoneword”, “ 확인” 버튼을 클릭 .

Page 4: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

2. 프로젝트가 생성되면 우측 솔루션 탐색기의 Resources -> Layout 아래의 Main.axml 을 더블 클릭하면 폰화면이 나타난다 , 이 파일이 스크린의 Layout 파일인데 만약 아래처럼 안드로이드 SDK 버전이 낮다고 하면 “ Open Android SDK” 를 클릭하여 Android SDK Manager 에서 업데이트를 해야 한다 . 업데이트할 때 비주얼 스튜디오는 Close 하는 것이 좋다 . ( 시간이 좀 걸림 )

Page 5: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

2. [Main.axml 을 더블 클릭했을 때의 정상적인 화면 ] 안드로이드 디자이너 화면안에 심플한 폰 이미지가 올라온다 .

Page 6: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

3. 좌측에 도구상자 (ToolBox) 가 보이지 않으면 보기메뉴 -> 도구상자를 클릭해서 보이도록 한후 Text(Large) 를 드래그 해서 폰화면의 상단 가운데 위치 시키자 . 4. Text(Large) 를 선택 후 우측하단 속성창애서 Text 속성을 " Enter a Phoneword : ” 로 설정하자 .

Page 7: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

5. 툴박스 (ToolBox) 에서 Plain Text 위젯을 선택 후 Text(Large) 박스 아래에 위치 시키고 id 속성을 “ @+id/PhoneNumberText”, Text 속성을 “ 010-0xamarin” 으로 설정하자 .

Page 8: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

6. 툴박스 (ToolBox) 에서 Button 을 선택 Plain Text 아래에 위치 시키고 id 속성은 “ @+id/TranslateButton”, Text 속성은 “변환하기”로 설정하자 .

Page 9: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

7. Button 을 하나 더 선택해서 “변환하기” 버튼 아래에 위치시키고 id 속성은 “ @+id/CallButton”, Text 속성은 “전화걸기”로 입력하자 .

Page 10: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

8. 알파벳 입력을 숫자로 변환하는 C# 코드를 작성하는데 오른쪽 솔루션 탐색기에서 프로젝트 -> 마우스 우측버튼 -> 추가 (Add) -> 새항목 (New Item) -> Vis-ual C# -> Code 를 선택하자 . 파일명은 “ PhoneTranslator.cs” 로 입력 .

[PhoneTranslator.cs]using System.Text;using System;

namespace Core{ public static class PhonewordTranslator { public static string ToNumber(string raw) { if (string.IsNullOrWhiteSpace(raw)) return ""; else raw = raw.ToUpperInvariant();

Page 11: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

8. “PhoneTranslator.cs” 작성중

var newNumber = new StringBuilder(); foreach (var c in raw) { if (" -0123456789".Contains(c)) newNumber.Append(c); else { var result = TranslateToNumber(c); if (result != null) newNumber.Append(result); } } return newNumber.ToString(); }

static bool Contains(this string keyString, char c) { return keyString.IndexOf(c) >= 0; }

static int? TranslateToNumber(char c) { if ("ABC".Contains(c)) return 2; else if ("DEF".Contains(c)) return 3; else if ("GHI".Contains(c)) return 4; else if ("JKL".Contains(c)) return 5; else if ("MNO".Contains(c)) return 6; else if ("PQRS".Contains(c)) return 7; else if ("TUV".Contains(c)) return 8; else if ("WXYZ".Contains(c)) return 9; return null; } }}

Page 12: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

9. 솔루션 탐색기에서 MainActivity.cs 파일을 오픈하자 . “ 변환하기“ 버튼 기능을 구현하는데 MainActivity 의 OnCreate() 메소드안에 변환버튼 , 전화걸기 버튼 기능을 구현한다 .

[MainActivity.cs]using System;using Android.App;using Android.Content;using Android.Runtime;using Android.Views;using Android.Widget;using Android.OS;

namespace phoneword{ [Activity(Label = "phoneword", MainLauncher = true, Icon = "@drawable/icon")] public class MainActivity : Activity {

protected override void OnCreate(Bundle bundle) { base.OnCreate(bundle); // Set our view from the "main" layout resource SetContentView (Resource.Layout.Main); //----------------------------------------------- // 로드된 UI 로 부터 컨트롤참조를 얻음 //----------------------------------------------- // 전화번호 입력창 EditText phoneNumberText = FindViewById<EditText>(Resource.Id.PhoneNumberText); // 변환버튼 Button translateButton = FindViewById<Button>(Resource.Id.TranslateButton);

Page 13: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

9. MainActivity.cs 작성중

// 전화걸기 버튼 Button callButton = FindViewById<Button>(Resource.Id.CallButton);  //----------------------------------------------------- // 변환하기 버튼 구현 //----------------------------------------------------- // Disable the "Call" button callButton.Enabled = false;  // 변환된 번호를 담는 변수 초기화 string translatedNumber = string.Empty;  // 변환하기 버튼 클릭 이벤트 핸들러 translateButton.Click += (object sender, EventArgs e) => {

// Translate user's alphanumeric phone number to numeric translatedNumber = Core.-PhonewordTranslator.ToNumber(phoneNumberText.Text); if (String.IsNullOrWhiteSpace(translatedNumber)) { callButton.Text = "Call"; callButton.Enabled = false; } else { callButton.Text = "Call " + trans-latedNumber; callButton.Enabled = true; } };

Page 14: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

9. MainActivity.cs 작성중

//----------------------------------------------------- // 전화걸기 버튼 코드 //----------------------------------------------------- callButton.Click += (object sender, Even-tArgs e) => { var callDialog = new AlertDialog.Builder(this); callDialog.SetMessage("Call " + translat-edNumber + "?");  //Call 클릭 callDialog.SetNeutralButton("Call", dele-gate { // Create intent to dial phone var callIntent = new Intent(Intent.ActionCall); callIntent.Set-Data(Android.Net.Uri.Parse("tel:" + translatedNum-ber)); StartActivity(callIntent); });

//Cancel 클릭 callDialog.SetNegativeButton("Cancel", dele-gate { });  // Show the alert dialog to the user and wait for response. callDialog.Show(); };  } }}

Page 15: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

10. 우리가 만든 Application 에 전화거는 기능을 활성화 시키자 . Android Man-ifest 안에 권한과 관련된 부분을 정의해야 하는데 솔루션 탐색기에서 Properties 를 더블클릭하고 좌측 Android Manifest 를 선택 후 하단의 Permission 중 CALL_PHONE permission 을 활성화 하자 .

Page 16: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

11. 모든 변경사항을 저장 (Ctrl+Shift+S) 하고 빌드하자 .(Build > Rebuild Solution)12. MainActivity.cs 의 Label 은 응용프로그램의 스크린 최상단에 디스플레이되는 텍스트이니 필요하다면 수정을 하면 된다 .

[Activity(Label = "phone word", MainLauncher = true, Icon = "@drawable/icon")] public class MainActivity : Activity {

13. 응용프로그램의 아이콘을 설정할 수 있는데 https://developer.xamarin.com/guides/android/getting_started/hello,android/Resources/XamarinAppIconsAndLaunchImages.zip 에서 아이콘 ZIP 파일을 다운받아 적당히 압축을 풀자 . 프로젝트의 Resources -> drawable 에 존재하는 Icon.png 파일을 먼저 삭제후 압축푼 경로 아래 Android\drawable 폴더의 Icon.png 를 다시 선택해 주면 되는데 솔루션 탐색기 -> Ressources -> drawable 에서 마우스 우측버튼 -> 추가 -> 기존항목 선택 후 압축 푼 경로의 Android\drawable 아래의 Icon.png 파일을 선택하면 아이콘이 등록된다 .

Page 17: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

14. 앞에서 다운 받은 파일의 Android\drawable* 폴더들을 프로젝트로 복사하면 되는데 drawable 폴더를 제외한 모든 폴더를 복사 후 프로젝트의 Resources 아래에 붙여넣자 .

Page 18: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

15. 다음은 Android Manifest 안에 아이콘을 등록하면 되는데 솔루션 탐색기의 Properties 더블클릭 -> 왼쪽에서 Android Manifest 를 선택 후 나타나는 화면의 Application Icon 메뉴에서 @drawble/Icon 을 선택하자 .

Page 19: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

16. 이제 이뮬레이터로 테스트를 해보도록 하자 .Properties 를 더블클릭 후 좌측 Application 에서 API LEVEL 23(mashimallow) 로 설정하고 이뮬레이터를 실행했다 . 상단의 실행단추를 눌러 실행하자 .

Page 20: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

17. 이제는 실제 휴대폰에서 실행해 보자 . 안드로이드 휴대폰을 USB 로 연결 후 폰에서 USB 디버깅을 활성화 해야 되는데 휴대폰 상단 설정을 클릭하고 더보기 -> 개발자옵션 ->USB 디버깅을 체크하자 .

솔루션 탐색기의 Properties 를 더블클릭 후 좌측 Application 을 선택 후 가운데 Minimum Android to target 에서 “ Use Compile using SDK Version” 으로 바꾼 후 비주얼 스튜디오의 상단 의 우측 화살표 클릭하여 USB 로 연결한 휴대폰을 선택 후 실행하면 된다 .

( 실제 전화도 잘 간다 . )

Page 21: C#,자마린실습(Hello 안드로이드,이뮬레이터와 휴대폰에서 직접실행)_닷넷기초/C#기초/자마린,Xamarin 앱개발강좌

This Practice makes the Expert!

C#,ADO.NET,Network프로그래밍 기초과정 C# 기초 , Xamarin 앱 개발과정 Xamarin 앱개발 과정