| Россия, г. Ейск |
Инспектор
Вы можете этот курс.
Опубликован: 01.11.2011 | Уровень: специалист | Доступ: платный
Практическая работа 6:
Создание простого приложения для телефона на Silverlight
< Лекция 8 || Практическая работа 6 || Практическая работа 7 >
Аннотация: На данном занятии мы познакомимся со средой разработки Microsoft Visual Studio 2010 Express for Windows Phone, в частности, с эмулятором телефона. Мы познакомимся с объектами PhoneApplicationFrame и PhoneApplicationPage и выведем на экран красиво отформатированный текст. После чего поработаем с элементом управления MapControl.
Ключевые слова: очередь, интерфейс, Windows, XAML, Visual Studio, phone, приложение, пункт, заголовки, слово, пространство, запись, сайт, ключ, пользователь, координаты
Дополнительные материалы к занятию можно скачать 
здесь.
Для телефона поддерживаются две технологии создания приложений: Silverlight и XNA. XNA в первую очередь предназначена для создания игр и приложений, работающих с 2D- и 3D-графикой.
Silverlight удобно использовать для бизнес-приложений, простых игр и прочих программ, имеющих "традиционный" управляемый событиями интерфейс (т.е. набор элементов управления типа строк ввода, списков и т.д.). Он приходит на смену более старым технологиям создания приложений Windows Forms. В основе Silverlight лежит принцип разделения разметки графического дизайна приложения и программного кода - интерфейс программируется с помощью XML-языка разметки XAML, а с действиями пользователя связываются события, программируемые отдельно на любом из .NET-языков (обычно на C#) [26].
Упражнение 14.1. Создание простейшего приложения MS Windows Phone 7
Запускаем Microsoft Visual Studio 2010 Express for Windows Phone
Создаем приложение p6. Выбираем пункт Windows Phone 7 Emulator.
Запускаем приложение, нажав кнопку F5:
В нашем приложении есть два заголовка - MY APPLICATION и PAGE NAME.
Внесем изменения в заголовки, заменив слово MY APPLICATION на Это-мое первое приложение и PAGE NAME - на Silverlight. Ниже приводится код xaml:
<phone:PhoneApplicationPage
x:Class="p6.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="Это-мое первое приложение " Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="Silverlight" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"></Grid>
</Grid>
</phone:PhoneApplicationPage>
Результат:
Упражнение 14.2. Знакомство с элементом управления MapControl
Элемент управления Map позволяет в Silverlight-приложениях отображать карту.
Создаем новое приложение Windows Phone p6_2. Из панели инструментов перетаскиваем элемент управления Map.
При этом подключается пространство имен:
xmlns:my="clr-namespace:Microsoft.Phone.Controls.Maps;assembly=Microsoft.Phone.Controls.Maps"
Запускаем проект
На карте при этом можно разглядеть белую надпись: Invalid Credentials. Sign up for a developer account - Нет достаточных прав, подпишитесь на учетную запись разработчика.
Для регистрации необходимо зайти на сайт http://www.bingmapsportal.com/ и зарегистрироваться в качестве нового пользователя:
Затем нужно создать свой ключ (Create or view keys):
После заполнения анкеты получаем примерно такой ключ:
Один пользователь может получить бесплатно до пяти ключей.
Полученный ключ можно добавить к элементу управления Map:
<my:Map Height="595" HorizontalAlignment="Left" Margin="0,6,0,0" Name="map1" VerticalAlignment="Top"
Width="456" CredentialsProvider="AqCnwcyoxN8o6P1nM76x9QNHNMvHLf5pQa-H8L77yju6wcBx2vwvWUniEEpR-ifw" />
Белая надпись при этом исчезнет.
Упражнение 14.3. Добавление точки (Pushpin) на карту
Для добавления точки на карту нужно указать координаты и подпись. Добавлять можно как в разметке xaml, так и в коде C#.
Создаем новый проект practice_13_2. Так же из панели инструментов перетаскиваем элемент управления Map.
Добавим точку в XAML разметке.
Для этого выбираем географическую широту и долготу интересующей нас точки (
северной широты и 
восточной долготы) и задаем подпись (Уфа):
<my:Map Height="595" HorizontalAlignment="Left" Margin="12,6,0,0" Name="map1" VerticalAlignment="Top"
Width="438" CredentialsProvider="AqCnwcyoxN8o6P1nM76x9QNHNMvHLf5pQa-H8L77yju6wcBx2vwvWUniEEpR-ifw" >
<my:Pushpin Location="54.73333333, 55.96666667" FontSize="30" Background="Orange" Content="Уфа" />
</my:Map>
Итоговый код приложения:
<phone:PhoneApplicationPage
x:Class="p6_3.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True" xmlns:my="clr-namespace:Microsoft.Phone.Controls.Maps;assembly=Microsoft.Phone.Controls.Maps">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<my:Map Height="595" HorizontalAlignment="Left" Margin="12,6,0,0" Name="map1" VerticalAlignment="Top"
Width="438" CredentialsProvider="AqCnwcyoxN8o6P1nM76x9QNHNMvHLf5pQa-H8L77yju6wcBx2vwvWUniEEpR-ifw" Mode="Aerial" >
<my:Pushpin Location="54.73333333, 55.96666667" FontSize="30" Background="Orange" Content="Уфа" />
</my:Map>
</Grid>
</Grid>
</phone:PhoneApplicationPage>
< Лекция 8 || Практическая работа 6 || Практическая работа 7 >
