1. \uc18c\uac1c<\/h2>\n
\n UWP(Universal Windows Platform)\ub294 Windows 10 \ubc0f \uadf8 \uc774\ud6c4 \ubc84\uc804\uc758 \ubaa8\ub4e0 \uc7a5\uce58\uc5d0\uc11c \uc2e4\ud589\ub418\ub294 \uc751\uc6a9 \ud504\ub85c\uadf8\ub7a8\uc744 \ub9cc\ub4dc\ub294 \n \ub370\uc774\ud130 \ubc14\uc778\ub529(Data Binding)\uc740 UI \uc694\uc18c\uc640 \ub370\uc774\ud130 \uc18c\uc2a4 \uac04\uc758 \uad00\uacc4\ub97c \uc124\uc815\ud558\ub294 \uae30\uc220\uc785\ub2c8\ub2e4. \ub370\uc774\ud130 \ubc14\uc778\ub529\uc744 \uc0ac\uc6a9\ud558\uba74 \n UWP\uc5d0\uc11c \ub370\uc774\ud130 \ubc14\uc778\ub529\uc740 \uc8fc\ub85c \ub450 \uac00\uc9c0 \ud615\ud0dc\ub85c \uc81c\uacf5\ub429\ub2c8\ub2e4: \ub2e8\ubc29\ud5a5 \ubc14\uc778\ub529\uacfc \uc591\ubc29\ud5a5 \ubc14\uc778\ub529\uc785\ub2c8\ub2e4.\n <\/p>\n \n \uc774\uc81c UWP \uc560\ud50c\ub9ac\ucf00\uc774\uc158\uc5d0\uc11c \ub370\uc774\ud130 \ubc14\uc778\ub529\uc744 \uad6c\ud604\ud558\ub294 \ubc29\ubc95\uc5d0 \ub300\ud574 \uc0b4\ud3b4\ubcf4\uaca0\uc2b5\ub2c8\ub2e4. \n MVVM\uc740 Model-View-ViewModel\uc758 \uc57d\uc790\ub85c, UWP \uc560\ud50c\ub9ac\ucf00\uc774\uc158\uc5d0\uc11c \ub370\uc774\ud130\ub97c \ucc98\ub9ac\ud558\ub294 \ub110\ub9ac \uc0ac\uc6a9\ub418\ub294 \ud328\ud134\uc785\ub2c8\ub2e4. \n \uc544\ub798\ub294 MVVM \ud328\ud134\uc744 \uc0ac\uc6a9\ud558\uc5ec \uc5f0\ub77d\ucc98 \ubaa9\ub85d\uc744 \uad00\ub9ac\ud558\ub294 \uac04\ub2e8\ud55c UWP \uc560\ud50c\ub9ac\ucf00\uc774\uc158\uc758 \uc608\uc2dc \ucf54\ub4dc\uc785\ub2c8\ub2e4.\n <\/p>\n \n \ub370\uc774\ud130 \ubc14\uc778\ub529\uc740 <\/p>\n \n UWP\uc5d0\uc11c\uc758 \ub370\uc774\ud130 \ubc14\uc778\ub529\uc740 \ud604\ub300\uc801\uc778 \uc560\ud50c\ub9ac\ucf00\uc774\uc158 \uac1c\ubc1c\uc5d0\uc11c \uc544\uc8fc \uc911\uc694\ud55c \uac1c\ub150\uc785\ub2c8\ub2e4. <\/body><\/p>\n","protected":false},"excerpt":{"rendered":"
\n \ud50c\ub7ab\ud3fc\uc785\ub2c8\ub2e4. UWP\ub294 \ud604\ub300\uc801\uc778 \uc0ac\uc6a9\uc790 \uc778\ud130\ud398\uc774\uc2a4\ub97c \uc81c\uacf5\ud558\uba70 \ub2e4\uc591\ud55c \ub514\ubc14\uc774\uc2a4\uc5d0\uc11c \uc2e4\ud589\ub420 \uc218 \uc788\ub3c4\ub85d \uc124\uacc4\ub418\uc5c8\uc2b5\ub2c8\ub2e4.
\n \uc774\uc640 \ud568\uaed8 \ub370\uc774\ud130 \ubc14\uc778\ub529\uc774\ub77c\ub294 \uac1c\ub150\uc774 UWP \uac1c\ubc1c\uc5d0\uc11c \uc911\uc694\ud55c \uc5ed\ud560\uc744 \ud569\ub2c8\ub2e4. \ub370\uc774\ud130 \ubc14\uc778\ub529\uc744 \ud1b5\ud574 \uac1c\ubc1c\uc790\ub294
\n UI \uc694\uc18c\uc5d0 \ub370\uc774\ud130 \uc18c\uc2a4\ub97c \uc5f0\uacb0\ud560 \uc218 \uc788\uc73c\uba70, \uc774\ub97c \ud1b5\ud574 \ub354 \ud6a8\uc728\uc801\uc774\uace0 \ub3d9\uc801\uc778 \uc751\uc6a9 \ud504\ub85c\uadf8\ub7a8\uc744 \uac1c\ubc1c\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.\n <\/p>\n<\/section>\n2. \ub370\uc774\ud130 \ubc14\uc778\ub529\uc758 \uac1c\ub150<\/h2>\n
\n UI\uac00 \ub370\uc774\ud130 \uc18c\uc2a4\uc758 \ubcc0\ud654\uc5d0 \uc989\uc2dc \ubc18\uc751\ud558\uac8c \ub9cc\ub4e4\uc5b4, \uac1c\ubc1c\uc790\ub294 UI\uc640 \ub370\uc774\ud130 \ub17c\ub9ac \uac04\uc758 \uc0c1\ud638\uc791\uc6a9\uc744 \uc27d\uac8c \ucc98\ub9ac\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.
\n \uc77c\ubc18\uc801\uc73c\ub85c \ubdf0(View)\uc640 \ubaa8\ub378(Model) \uac04\uc758 \uc5f0\uacb0\uc744 \uc81c\uacf5\ud558\uba70, MVVM(Model-View-ViewModel) \uc544\ud0a4\ud14d\ucc98\uc5d0 \uc801\ud569\ud569\ub2c8\ub2e4.\n <\/p>\n2.1. \ub370\uc774\ud130 \ubc14\uc778\ub529\uc758 \uc885\ub958<\/h3>\n
\n
\n \ub370\uc774\ud130\uac00 \ubcc0\uacbd\ub418\uba74 UI\ub294 \ubcc0\uacbd\uc0ac\ud56d\uc744 \ubc18\uc601\ud558\uc9c0\ub9cc, UI\uc5d0\uc11c\uc758 \ubcc0\uacbd\uc740 \ub370\uc774\ud130 \uc18c\uc2a4\uc5d0 \uc601\ud5a5\uc744 \ubbf8\uce58\uc9c0 \uc54a\uc2b5\ub2c8\ub2e4.<\/li>\n
\n UI\uc5d0\uc11c \ub370\uc774\ud130\uac00 \ubcc0\uacbd\ub418\uba74 \ub370\uc774\ud130 \uc18c\uc2a4\ub3c4 \uc790\ub3d9\uc73c\ub85c \uc5c5\ub370\uc774\ud2b8\ub429\ub2c8\ub2e4.<\/li>\n<\/ul>\n<\/section>\n3. UWP\uc5d0\uc11c \ub370\uc774\ud130 \ubc14\uc778\ub529 \uad6c\ud604\ud558\uae30<\/h2>\n
\n \uc608\uc81c\ub85c\ub294 \uac04\ub2e8\ud55c \uc5f0\ub77d\ucc98 \ubaa9\ub85d\uc744 \uad00\ub9ac\ud558\ub294 \uc560\ud50c\ub9ac\ucf00\uc774\uc158\uc744 \ub9cc\ub4e4 \uac83\uc785\ub2c8\ub2e4.\n <\/p>\n<\/section>\n4. MVVM \ud328\ud134 \uc774\ud574\ud558\uae30<\/h2>\n
\n MVVM \ud328\ud134\uc744 \uc0ac\uc6a9\ud558\uba74 \ucf54\ub4dc\uc758 \uc7ac\uc0ac\uc6a9\uc131\uc774 \ub192\uc544\uc9c0\uace0, \ud14c\uc2a4\ud2b8 \uac00\ub2a5\uc131\uc774 \ud5a5\uc0c1\ub429\ub2c8\ub2e4.\n <\/p>\n\n
5. \uc608\uc81c \ucf54\ub4dc \uc791\uc131\ud558\uae30<\/h2>\n
5.1. Model \ud074\ub798\uc2a4 \uc0dd\uc131<\/h3>\n
public class Contact\n{\n public string Name { get; set; }\n public string PhoneNumber { get; set; }\n}\n <\/code><\/pre>\n5.2. ViewModel \ud074\ub798\uc2a4 \uc0dd\uc131<\/h3>\n
using System.Collections.ObjectModel;\nusing System.ComponentModel;\n\npublic class ContactViewModel : INotifyPropertyChanged\n{\n public ObservableCollection<Contact> Contacts { get; set; }\n\n public ContactViewModel()\n {\n Contacts = new ObservableCollection<Contact>();\n LoadContacts();\n }\n\n private void LoadContacts()\n {\n Contacts.Add(new Contact { Name = \"\ud64d\uae38\ub3d9\", PhoneNumber = \"123-456-7890\" });\n Contacts.Add(new Contact { Name = \"\uae40\ucca0\uc218\", PhoneNumber = \"987-654-3210\" });\n }\n\n public event PropertyChangedEventHandler PropertyChanged;\n protected void OnPropertyChanged(string propertyName)\n {\n PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));\n }\n}\n <\/code><\/pre>\n5.3. View (XAML) \uad6c\ud604<\/h3>\n
<Page\n x:Class=\"MyContactsApp.MainPage\"\n xmlns=\"http:\/\/schemas.microsoft.com\/winfx\/2006\/xaml\/presentation\"\n xmlns:x=\"http:\/\/schemas.microsoft.com\/winfx\/2006\/xaml\"\n xmlns:local=\"using:MyContactsApp\">\n\n <Grid>\n <ListView ItemsSource=\"{Binding Contacts}\">\n <ListView.ItemTemplate>\n <DataTemplate>\n <StackPanel>\n <TextBlock Text=\"{Binding Name}\"\/>\n <TextBlock Text=\"{Binding PhoneNumber}\"\/>\n <\/StackPanel>\n <\/DataTemplate>\n <ListView.ItemTemplate>\n <\/ListView>\n <\/Grid>\n<\/Page>\n <\/code><\/pre>\n5.4. MainPage.xaml.cs \uc124\uc815<\/h3>\n
using Windows.UI.Xaml.Controls;\n\npublic sealed partial class MainPage : Page\n{\n public MainPage()\n {\n this.InitializeComponent();\n this.DataContext = new ContactViewModel();\n }\n}\n <\/code><\/pre>\n<\/section>\n6. \ub370\uc774\ud130 \ubc14\uc778\ub529\uc758 \uc7a5\uc810<\/h2>\n
\n
7. \uacb0\ub860<\/h2>\n
\n \uc774 \uae30\uc220\uc744 \ud1b5\ud574 UI \uc694\uc18c\ub97c \ub370\uc774\ud130\uc640 \ub3d9\uae30\ud654\ud558\uace0 \ud6a8\uc728\uc801\uc778 MVVM \uc544\ud0a4\ud14d\ucc98\ub97c \ud65c\uc6a9\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.
\n \uc774 \uae00\uc5d0\uc11c \uc18c\uac1c\ud55c \ub0b4\uc6a9\uc744 \ubc14\ud0d5\uc73c\ub85c \uc5ec\ub7ec\ubd84\uc758 UWP \uac1c\ubc1c \uacbd\ud5d8\uc774 \ub354\uc6b1 \ud48d\ubd80\ud574\uc9c0\uae38 \ubc14\ub78d\ub2c8\ub2e4.
\n \ub354 \ub098\uc544\uac00 \ub370\uc774\ud130 \ubc14\uc778\ub529\uc758 \ub2e4\uc591\ud55c \uae30\ub2a5\uacfc \uae30\ubc95\uc744 \ud3ec\ud568\ud558\uc5ec \uc560\ud50c\ub9ac\ucf00\uc774\uc158\uc744 \ub354\uc6b1 \ubc1c\uc804\uc2dc\ud0ac \uc218 \uc788\ub294 \ubc29\ubc95\uc744 \uc2e4\ud5d8\ud574 \ubcf4\uc2dc\uae30 \ubc14\ub78d\ub2c8\ub2e4.\n <\/p>\n<\/section>\n<\/article>\n