내보내기(0) 인쇄
모두 확장

방법: Windows Phone의 타일 만들기, 삭제 및 업데이트

2012-02-09

이 샘플은 ShellTile API를 사용하여 응용프로그램 타일을 업데이트하는 방법을 보여 줍니다. 또한 보조 타일을 만들고, 삭제하고, 업데이트하는 방법도 보여 줍니다. Windows Phone의 타일 개요에는 타일 속성 및 타일을 업데이트하는 데 사용할 수 있는 다양한 메서드에 대한 정보가 나와 있습니다.

샘플 응용프로그램에는 3개의 페이지가 있습니다. MainPage는 단순히 나머지 두 페이지로 이동하는 데 사용합니다. ApplicationTile 페이지에서는 응용프로그램의 속성을 업데이트할 수 있습니다. 모든 속성은 한 번에 설정됩니다. SecondaryTile 페이지에서는 보조 타일을 만들고, 업데이트하고, 삭제할 수 있습니다. 그리고 각 속성을 개별적으로 설정할 수 있습니다. 뿐만 아니라 QueryString에서 값을 가져오는 과정도 표시됩니다. 사용자가 MainPage에서 SecondaryTile 페이지로 이동하면 DefaultTitle 값은 FromMain이 됩니다. 사용자가 보조 타일을 탭하여 SecondaryTile 페이지로 이동하면 DefaultTitle 값은 FromTile이 됩니다.

참고참고:

ShellTile은 응용프로그램 타일의 속성을 업데이트하는 데 사용할 수 있지만 응용프로그램 타일을 만들거나 삭제하는 데는 사용할 수 없습니다. 응용프로그램 타일 만들기 및 삭제에 대한 자세한 내용은 Windows Phone의 타일 개요를 참조하십시오.

전체 샘플은 Windows Phone용 코드 샘플에서 찾을 수 있습니다.

이 단계에서는 새 프로젝트를 만들고 응용프로그램의 세 페이지 MainPage, ApplicationTile, SecondaryTile에 대한 UI를 디자인합니다.

AP_Tiles_TileSample_Layout

UI 레이아웃을 만들려면

  1. 새 Windows Phone용 Silverlight 프로젝트를 만들고 이름을 TileSample로 지정합니다.

  2. Microsoft 그림판이나 다른 이미지 편집 도구를 사용하여 배경 이미지로 사용할 타일 크기(173 x 173)의 이미지 파일 3개를 만듭니다. 편의상 빨강, 파랑, 녹색의 단색 파일로 만들어도 좋습니다. 이들 파일의 이름을 Red.jpg, Blue.jpg, Green.jpg로 지정합니다. Windows Phone용 코드 샘플에서 TileSample 프로젝트를 다운로드하여 거기에 포함된 이미지를 사용할 수도 있습니다. 솔루션 탐색기에서 TileSample 파일을 선택하고 메뉴에서 프로젝트 | 기존 항목 추가를 선택하여 3개의 이미지 파일을 프로젝트에 추가합니다. 3개의 이미지 파일을 선택하고 추가를 클릭합니다. 이미지 파일마다 Build Action 속성을 Content로 설정합니다.

  3. TitlePanel을 다음 XAML 코드로 바꾸어 응용프로그램의 이름 및 MainPage의 제목을 설정합니다.

            <!--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="Tile Sample" Style="{StaticResource PhoneTextNormalStyle}"/>
                <TextBlock x:Name="PageTitle" Text="Tiles" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
            </StackPanel>
    
    
  4. MainPage에 사용할 XAML 코드는 아래에 있습니다. 이 코드에는 텍스트 블록 하나와 버튼 2개가 포함됩니다.

    컨트롤 형식

    컨트롤 이름

    컨트롤 내용

    TextBlock

    textBlockDescription

    이 샘플은 응용프로그램 타일을 업데이트하는 방법을 보여 줍니다. 또한 보조 타일을 만들고, 업데이트하고, 삭제하는 방법도 보여 줍니다.

    Button

    buttonChangeApplicationTile

    응용프로그램 타일을 변경합니다.

    Button

    buttonChangeSecondaryTile

    보조 타일을 변경합니다.

    각 버튼은 button_Click 이벤트를 처리합니다.

    MainPage UI를 만들려면 MainPage.xaml에서 <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"></Grid>를 다음 코드로 바꿉니다.

            <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
                <TextBlock Height="170" HorizontalAlignment="Left" Margin="12,6,0,0" Name="textBlockDescription" Text="This sample demonstrates how to update Application Tiles.  It also demonstrates how to create, update, and delete secondary Tiles." VerticalAlignment="Top" Width="438" TextWrapping="Wrap" TextAlignment="Left" />
                <Button Content="Change Application Tile" Height="72" HorizontalAlignment="Left" Margin="28,182,0,0" Name="buttonChangeApplicationTile" VerticalAlignment="Top" Width="392" Click="buttonChangeApplicationTile_Click" />
                <Button Content="Change Secondary Tile" Height="72" HorizontalAlignment="Left" Margin="28,278,0,0" Name="buttonChangeSecondaryTile" VerticalAlignment="Top" Width="392" Click="buttonChangeSecondaryTile_Click" />
            </Grid>
    
    
  5. 다음 단계는 ApplicationTile.xaml의 UI 만들기입니다. ApplicationTile UI를 만들려면 솔루션 탐색기에서 TileSample 프로젝트를 선택하고 메뉴에서 프로젝트 | 새 항목 추가를 선택합니다. 새 Windows Phone 세로 페이지를 추가하고 이름을 ApplicationTile.xaml로 지정합니다. 추가를 클릭하면 ApplicationTile.xaml 및 ApplicationTile.xaml.cs 파일이 만들어집니다.

  6. TitlePanel을 다음 XAML 코드로 바꾸어 응용프로그램의 이름 및 ApplicationTile 페이지의 제목을 설정합니다.

            <!--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="Tile Sample" Style="{StaticResource PhoneTextNormalStyle}"/>
                <TextBlock x:Name="PageTitle" Text="Application Tile" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" FontSize="64" />
            </StackPanel>
    
    
  7. ApplicationTile에 사용할 XAML 코드는 아래에 있습니다. 이 코드에는 텍스트 블록 하나, 여섯 개의 텍스트 블록과 5개의 텍스트 박스 시리즈 및 그 속성을 설정할 버튼 하나가 포함됩니다.

    컨트롤 형식

    컨트롤 이름

    컨트롤 내용

    TextBlock

    textBlockDescription

    응용프로그램 타일 속성을 그룹으로 설정합니다. 속성을 지우려면 텍스트 및 이미지 속성을 비워 둡니다. Count 속성을 지우려면 Count를 0으로 설정합니다.

    TextBlock

    textBlockTitle

    Title

    TextBox

    textBoxTitle

    <blank>

    TextBlock

    textBlockBackgroundImage

    Background Image

    TextBox

    textBoxBackground

    <blank>

    TextBlock

    textBlockCount

    Count (1-99, 0=Clear)

    TextBox

    textBoxCount

    <blank>

    TextBlock

    textBlockBackTitle

    BackTitle

    TextBox

    textBoxBackTitle

    <blank>

    TextBlock

    textBlockBackBackgroundImage

    BackBackground Image

    TextBox

    textBoxBackBackGround

    <blank>

    TextBlock

    textBlockBackContent

    BackContent

    TextBox

    textBoxBackContent

    <blank>

    Button

    buttonSetApplicationTile

    응용프로그램 타일 속성 설정

    buttonSetApplicationTilebutton_Click 이벤트를 처리합니다.

    ApplicationTile.xaml에서 <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"></Grid>를 다음 코드로 바꿉니다.

            <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
                <TextBlock Height="75" HorizontalAlignment="Left" Margin="12,6,0,0" Name="textBlockDescription" Text="Sets Application Tile properties as a group. Leave text and image properties blank to clear the property. Set Count to 0 to clear the Count property." VerticalAlignment="Top" Width="438" TextWrapping="Wrap" FontSize="16" />
                <TextBlock Height="30" HorizontalAlignment="Left" Margin="164,96,0,0" Name="textBlockTitle" Text="Title" VerticalAlignment="Top" FontSize="18" />
                <TextBox Height="72" HorizontalAlignment="Left" Margin="197,74,0,0" Name="textBoxTitle" Text="" VerticalAlignment="Top" Width="260" />
                <TextBlock Height="30" HorizontalAlignment="Left" Margin="46,171,0,0" Name="textBlockBackgroundImage" Text="Background Image" VerticalAlignment="Top" FontSize="18" />
                <TextBox Height="72" HorizontalAlignment="Left" Margin="197,152,0,0" Name="textBoxBackgroundImage" Text="" VerticalAlignment="Top" Width="260" />
                <TextBlock Height="30" HorizontalAlignment="Left" Margin="23,249,0,0" Name="textBlockCount" Text="Count (1-99, 0=Clear)" VerticalAlignment="Top" FontSize="18" Width="175" />
                <TextBox Height="72" HorizontalAlignment="Left" Margin="197,230,0,0" Name="textBoxCount" Text="" VerticalAlignment="Top" Width="260" InputScope="Number" />
                <TextBlock Height="30" HorizontalAlignment="Left" Margin="127,359,0,0" Name="textBlockBackTitle" Text="BackTitle" VerticalAlignment="Top" FontSize="18" />
                <TextBox Height="72" HorizontalAlignment="Left" Margin="197,338,0,0" Name="textBoxBackTitle" Text="" VerticalAlignment="Top" Width="260" />
                <TextBlock Height="30" HorizontalAlignment="Left" Margin="10,436,0,0" Name="textBlockBackBackgroundImage" Text="BackBackground Image" VerticalAlignment="Top" FontSize="18" />
                <TextBox Height="72" HorizontalAlignment="Left" Margin="197,416,0,0" Name="textBoxBackBackgroundImage" Text="" VerticalAlignment="Top" Width="260" />
                <TextBlock Height="30" HorizontalAlignment="Left" Margin="97,515,0,0" Name="textBlockContent" Text="BackContent" VerticalAlignment="Top" FontSize="18" />
                <TextBox Height="72" HorizontalAlignment="Left" Margin="197,494,0,0" Name="textBoxBackContent" Text="" VerticalAlignment="Top" Width="260" />
                <Button Content="Set Application Tile Properties" Height="72" HorizontalAlignment="Left" Margin="23,551,23,0" Name="buttonSetApplicationTile" VerticalAlignment="Top" Width="410" FontSize="20" FontFamily="Calibri" Click="buttonSetApplicationTile_Click" />
            </Grid>
    
    
  8. UI를 만드는 마지막 단계는 SecondaryTile.xaml 페이지를 추가하는 것입니다. SecondaryTile UI를 만들려면 솔루션 탐색기에서 TileSample 프로젝트 이름을 선택하고 메뉴에서 프로젝트 | 새 항목 추가를 선택합니다. 새 Windows Phone 세로 페이지를 추가하고 이름을 SecondaryTile.xaml로 지정합니다. 추가를 클릭하면 SecondaryTile.xaml 및 SecondaryTile.xaml.cs 파일이 만들어집니다.

  9. TitlePanel을 다음 XAML 코드로 바꾸어 응용프로그램의 이름 및 SecondaryTile 페이지의 제목을 설정합니다.

            <!--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="Tile Sample" Style="{StaticResource PhoneTextNormalStyle}"/>
                <TextBlock x:Name="PageTitle" Text="Secondary Tile" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" FontSize="64" />
            </StackPanel>
    
    
  10. SecondaryTile에 사용할 XAML 코드는 아래에 있습니다. 이 코드에는 확인란 하나, 텍스트 블록 하나, 6개의 텍스트 상자 시리즈, 버튼 6개가 포함됩니다.

    컨트롤 형식

    컨트롤 이름

    컨트롤 내용

    CheckBox

    checkBoxDisplaySecondaryTile

    보조 타일 표시

    TextBlock

    textBlockDescription

    보조 타일의 속성을 개별적으로 설정합니다.

    TextBox

    textBoxTitle

    <blank>

    Button

    buttonTitle

    Title

    TextBox

    textBoxBackGround

    <blank>

    Button

    buttonBackGround

    Background

    TextBox

    textBoxCount

    <blank>

    Button

    buttonCount

    Count

    TextBox

    textBoxBackTitle

    <blank>

    Button

    buttonBackTitle

    Back Title

    TextBox

    textBoxBackBackGround

    <blank>

    Button

    buttonBackBackGround

    Back Background

    TextBox

    textBoxBackContent

    <blank>

    Button

    buttonBackContent

    Back Content

    checkBoxDisplaySecondaryTile 컨트롤은 checkboxDisplaySecondaryTile_CheckedcheckboxDisplaySecondaryTile_Unchecked 이벤트를 처리하게 됩니다.

    각 버튼은 button_Click 이벤트를 처리합니다.

    Secondary.xaml에서 <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"></Grid>를 다음 코드로 바꿉니다.

            <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
                <CheckBox Content="Display Secondary Tile " Height="72" HorizontalAlignment="Left" Margin="20,4,0,0" Name="checkBoxDisplaySecondaryTile" VerticalAlignment="Top" Checked="checkBoxDisplaySecondaryTile_Checked" Unchecked="checkBoxDisplaySecondaryTile_Unchecked" />
                <TextBlock Height="33" HorizontalAlignment="Center" Margin="9,91,0,0" Name="textBlockDescription" Text="Sets properties of the secondary Tile individually." VerticalAlignment="Top" Width="441" TextAlignment="Center" />
    
                <TextBox Height="72" HorizontalAlignment="Left" Margin="9,127,0,0" Name="textBoxTitle" Text="" VerticalAlignment="Top" Width="260" />
                <Button Content="Set Title" Height="72" HorizontalAlignment="Left" Margin="259,127,0,0" Name="buttonSetTitle" VerticalAlignment="Top" Width="200" Click="buttonSetTitle_Click" FontSize="16" />
    
                <TextBox Height="72" HorizontalAlignment="Left" Margin="9,205,0,0" Name="textBoxBackgroundImage" Text="" VerticalAlignment="Top" Width="260" />
                <Button Content="Set Background" Height="72" HorizontalAlignment="Left" Margin="259,205,0,0" Name="buttonSetBackgroundImage" VerticalAlignment="Top" Width="200" FontSize="16" Click="buttonSetBackgroundImage_Click" />
    
                <TextBox Height="72" HorizontalAlignment="Left" Margin="9,283,0,0" Name="textBoxCount" Text="" VerticalAlignment="Top" Width="260"  InputScope="Number"/>
                <Button Content="Set Count(1-99,0=Clear)" Height="72" HorizontalAlignment="Left" Margin="259,283,0,0" Name="buttonSetCount" VerticalAlignment="Top" Width="200" Click="buttonSetCount_Click" FontSize="14" />
    
                <TextBox Height="72" HorizontalAlignment="Left" Margin="9,391,0,0" Name="textBoxBackTitle" Text="" VerticalAlignment="Top" Width="260" />
                <Button Content="Set BackTitle" Height="72" HorizontalAlignment="Left" Margin="259,391,0,0" Name="buttonSetBackTitle" VerticalAlignment="Top" Width="200" Click="buttonSetBackTitle_Click" FontSize="16" />
    
                <TextBox Height="72" HorizontalAlignment="Left" Margin="9,469,0,0" Name="textBoxBackBackgroundImage" Text="" VerticalAlignment="Top" Width="260" />
                <Button Content="Set BackBackground" Height="72" HorizontalAlignment="Left" Margin="259,469,0,0" Name="buttonSetBackBackgroundImage" VerticalAlignment="Top" Width="200" FontSize="16" Click="buttonSetBackBackgroundImage_Click" />
    
                <TextBox Height="72" HorizontalAlignment="Left" Margin="9,547,0,0" Name="textBoxBackContent" Text="" VerticalAlignment="Top" Width="260" />
                <Button Content="Set BackContent" Height="72" HorizontalAlignment="Left" Margin="259,547,0,0" Name="buttonSetBackContent" VerticalAlignment="Top" Width="200" FontSize="16" Click="buttonSetBackContent_Click" />
            </Grid>
    
    
    

MainPage를 구현하려면 MainPage의 버튼 2개에 대한 이벤트 처리기를 추가해야 합니다.

MainPage 기능을 구현하려면

  • MainPage.xaml.cs에 다음 코드를 추가합니다. 이 코드는 button_Click 이벤트에 대한 이벤트 처리기를 구현합니다. 버튼을 클릭하면 응용프로그램은 해당 페이지로 이동합니다. SecondaryTile 페이지로 이동할 경우 매개 변수 DefaultTitle은 SecondaryTile 페이지에서 해당 이동의 출발점을 알 수 있도록 FromMain으로 설정됩니다. 나중에 타일에서 SecondaryPage로 이동할 때 DefaultTitleFromTile로 설정합니다.

    
            // Navigate to the page for modifying Application Tile properties.
            private void buttonChangeApplicationTile_Click(object sender, RoutedEventArgs e)
            {
                this.NavigationService.Navigate(new Uri("/ApplicationTile.xaml", UriKind.Relative));
            }
    
    
            // Navigate to the page for modifying secondary Tile properties. 
            // Pass a parameter that lets the SecondaryTile page know that it was navigated to from MainPage.
            // (DefaultTitle will equal 'FromTile' when the user navigates to the SecondaryTile page from a Tile.
            private void buttonChangeSecondaryTile_Click(object sender, RoutedEventArgs e)
            {
                this.NavigationService.Navigate(new Uri("/SecondaryTile.xaml?DefaultTitle=FromMain", UriKind.Relative));
            }
    
    

ApplicationTile 페이지를 구현하려면 buttonSetApplicationTile_Click 이벤트에 대한 이벤트 처리기를 추가해야 합니다.

ApplicationTile 페이지 기능을 구현하려면

  1. ShellTile 네임스페이스에 대해 ApplicationTile.xaml.cs 파일의 맨 위에 using 지시문을 추가합니다.

    using Microsoft.Phone.Shell;
    
    
  2. MainPage.xaml.cs에 다음 코드를 추가합니다. 이 코드는 buttonSetApplicationTile_Click 이벤트에 대한 이벤트 처리기를 구현합니다. 텍스트 상자에 입력된 값을 사용하여 응용프로그램 타일의 모든 속성을 한 번에 설정합니다.

    
            // Set all the properties of the Application Tile.
            private void buttonSetApplicationTile_Click(object sender, RoutedEventArgs e)
            {
                int newCount = 0;
    
                // Application Tile is always the first Tile, even if it is not pinned to Start.
                ShellTile TileToFind = ShellTile.ActiveTiles.First();
    
                // Application should always be found
                if (TileToFind != null)
                {
                    // if Count was not entered, then assume a value of 0
                    if (textBoxCount.Text == "")
                    {
                        // A value of '0' means do not display the Count.
                        newCount = 0;
                    }
                    // otherwise, get the numerical value for Count
                    else
                    {
                        newCount = int.Parse(textBoxCount.Text);
                    }
    
                    // Set the properties to update for the Application Tile.
                    // Empty strings for the text values and URIs will result in the property being cleared.
                    StandardTileData NewTileData = new StandardTileData
                    {
                        Title = textBoxTitle.Text,
                        BackgroundImage = new Uri(textBoxBackgroundImage.Text, UriKind.Relative),
                        Count = newCount,
                        BackTitle = textBoxBackTitle.Text,
                        BackBackgroundImage = new Uri(textBoxBackBackgroundImage.Text, UriKind.Relative),
                        BackContent = textBoxBackContent.Text
                    };
    
                    // Update the Application Tile
                    TileToFind.Update(NewTileData);
                }
            }
    
    

SecondaryTile 페이지를 구현하려면 보조 타일의 상태에 따라 확인란을 설정하고, 확인란의 선택 여부에 따라 확인란을 만들거나 삭제하고, 각 버튼에 대한 이벤트 처리기를 추가해야 합니다.

SecondaryTile 페이지 기능을 구현하려면

  1. ShellTile 네임스페이스에 대해 SecondaryTile.xaml.cs 파일의 맨 위에 using 지시문을 추가합니다.

    using Microsoft.Phone.Shell;
    
    
  2. OnNavigatedTo 이벤트 처리기를 추가합니다. 이 페이지로 이동할 때마다 보조 타일이 있는지 확인하고 확인란을 적절하게 설정해야 합니다. 타QueryString에 설정된 DefaultTitle에 따라 타일의 기본값 또한 여기에서 설정합니다.

    
            // Event handler for when this page is navigated to. Looks to see
            // whether the Tile exists and set the check box appropriately.
            // Also fills in the default value for the Title, based on the
            // value passed in in the QueryString - either FromMain or FromTile.        
            protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
            {
                base.OnNavigatedTo(e);
    
                // See whether the Tile is pinned, and if so, make sure the check box for it is checked.
                // (User may have deleted it manually.)
                ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(x => x.NavigationUri.ToString().Contains("DefaultTitle=FromTile"));
    
                checkBoxDisplaySecondaryTile.IsChecked = (TileToFind != null);
    
                // To demonstrate the use of the Navigation URI and query parameters, we set the default value
                // of the Title text box based on where we navigated from. If we navigated to this page
                // from the MainPage, the DefaultTitle parameter will be "FromMain". If we navigated here
                // when the secondary Tile was tapped, the parameter will be "FromTile".
                textBoxTitle.Text = this.NavigationContext.QueryString["DefaultTitle"];
    
            }
    
    
  3. checkBoxDisplaySecondaryTile_Checked 이벤트 처리기에 대해 다음 코드를 추가합니다. 이 코드는 지정된 ID를 가진 타일이 이미 있는지 여부를 확인합니다. 타일이 없으면 코드는 StandardTileData 개체를 만들고 이를 사용하여 타일 앞면과 뒷면의 속성을 설정합니다.

    
            // Event handler for when the check box is checked. Create a secondary Tile if it doesn't
            // already exist.
            private void checkBoxDisplaySecondaryTile_Checked(object sender, RoutedEventArgs e)
            {
                // Look to see whether the Tile already exists and if so, don't try to create it again.
                ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(x => x.NavigationUri.ToString().Contains("DefaultTitle=FromTile"));
    
                // Create the Tile if we didn't find that it already exists.
                if (TileToFind == null)
                {
                    // Create the Tile object and set some initial properties for the Tile.
                    // The Count value of 12 shows the number 12 on the front of the Tile. Valid values are 1-99.
                    // A Count value of 0 indicates that the Count should not be displayed.
                    StandardTileData NewTileData = new StandardTileData
                    {
                        BackgroundImage = new Uri("Red.jpg", UriKind.Relative),
                        Title = "Secondary Tile",
                        Count = 12,
                        BackTitle = "Back of Tile",
                        BackContent = "Welcome to the back of the Tile",
                        BackBackgroundImage = new Uri("Blue.jpg", UriKind.Relative)
                    };
    
                    // Create the Tile and pin it to Start. This will cause a navigation to Start and a deactivation of our application.
                    ShellTile.Create(new Uri("/SecondaryTile.xaml?DefaultTitle=FromTile", UriKind.Relative), NewTileData);
                }
    
            }
    
    
    
  4. checkBoxDisplaySecondaryTile_Unchecked 이벤트 처리기에 다음 코드를 추가합니다. 이 코드는 지정된 ID를 가진 타일을 검색한 다음, 타일이 있으면 시작 화면에서 제거합니다.

    
            // Event handler for when the check box is unchecked.  Delete the secondary Tile
            // if it exists.
            private void checkBoxDisplaySecondaryTile_Unchecked(object sender, RoutedEventArgs e)
            {
                // Find the Tile we want to delete.
                ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(x => x.NavigationUri.ToString().Contains("DefaultTitle=FromTile"));
    
                // If the Tile was found, then delete it.
                if (TileToFind != null)
                {
                    TileToFind.Delete();
                }
    
            }
    
    
  5. button_Click 이벤트 처리기 각각을 추가합니다. 각 이벤트 처리기는 업데이트할 타일을 찾아보고, 해당 텍스트 상자에서 새 값을 가져온 다음 이 값으로 타일을 업데이트합니다.

    
            // Handle the Title button clicked event by setting the front of Tile title.
            private void buttonSetTitle_Click(object sender, RoutedEventArgs e)
            {
                // Find the Tile we want to update.
                ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(x => x.NavigationUri.ToString().Contains("DefaultTitle=FromTile"));
    
                // If the Tile was found, then update the Title.
                if (TileToFind != null)
                {
                    StandardTileData NewTileData = new StandardTileData
                    {
                        Title = textBoxTitle.Text
                    };
    
                    TileToFind.Update(NewTileData);
                }
    
            }
    
    
            // Handle the Background Image button clicked event by setting the front of Tile background image.
            private void buttonSetBackgroundImage_Click(object sender, RoutedEventArgs e)
            {
                // Find the Tile we want to update.
                ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(x => x.NavigationUri.ToString().Contains("DefaultTitle=FromTile"));
    
                // If the Tile was found, then update the background image.
                if (TileToFind != null)
                {
                    StandardTileData NewTileData = new StandardTileData
                    {
                        BackgroundImage = new Uri(textBoxBackgroundImage.Text, UriKind.Relative)
                    };
    
                    TileToFind.Update(NewTileData);
                }
    
            }
    
            // Handle the Count button clicked event by setting the front of Tile count value.
            private void buttonSetCount_Click(object sender, RoutedEventArgs e)
            {
                int newCount = 0;
    
                // Find the Tile we want to update.
                ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(x => x.NavigationUri.ToString().Contains("DefaultTitle=FromTile"));
    
                // If the Tile was found, then update the count.
                if (TileToFind != null)
                {
                    // if Count was not entered, then assume a value of 0.
                    if (textBoxCount.Text == "")
                    {
                        newCount = 0;
                    }
                    // Otherwise, get the numerical value for Count.
                    else
                    {
                        newCount = int.Parse(textBoxCount.Text);
                    }
    
                    StandardTileData NewTileData = new StandardTileData
                    {
                        Count = newCount
                    };
    
                    TileToFind.Update(NewTileData);
                }
    
            }
    
    
            // Handle the Back Title button clicked event by setting the back of Tile title.
            private void buttonSetBackTitle_Click(object sender, RoutedEventArgs e)
            {
                // Find the Tile we want to update.
                ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(x => x.NavigationUri.ToString().Contains("DefaultTitle=FromTile"));
    
                // If the Tile was found, then update the title on the back of the Tile.
                if (TileToFind != null)
                {
                    StandardTileData NewTileData = new StandardTileData
                    {
                        BackTitle = textBoxBackTitle.Text
                    };
    
                    TileToFind.Update(NewTileData);
                }
    
            }
    
    
            // Handle the Back Background Image button clicked event by setting the back of Tile background image.
            private void buttonSetBackBackgroundImage_Click(object sender, RoutedEventArgs e)
            {
                // Find the Tile we want to update.
                ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(x => x.NavigationUri.ToString().Contains("DefaultTitle=FromTile"));
    
                // If the Tile was found, then update the background image on the back of the Tile.
                if (TileToFind != null)
                {
                    StandardTileData NewTileData = new StandardTileData
                    {
                        BackBackgroundImage = new Uri(textBoxBackBackgroundImage.Text, UriKind.Relative)
                    };
    
                    TileToFind.Update(NewTileData);
                }
    
            }
    
            // Handle the Back Content button clicked event by setting the back of Tile content.
            private void buttonSetBackContent_Click(object sender, RoutedEventArgs e)
            {
                // Find the Tile we want to update.
                ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(x => x.NavigationUri.ToString().Contains("DefaultTitle=FromTile"));
    
                // If the Tile was found, then update the content on the back of the Tile.
                if (TileToFind != null)
                {
                    StandardTileData NewTileData = new StandardTileData
                    {
                        BackContent = textBoxBackContent.Text
                    };
    
                    TileToFind.Update(NewTileData);
                }
    
            }
    
    
    

이제 보조 타일을 만들고, 삭제하고, 업데이트하는 코드를 완료했습니다.

응용프로그램을 테스트하려면

  1. F5 키를 눌러 응용프로그램 디버깅을 시작합니다. 응용프로그램이 에뮬레이터에서 시작됩니다.

  2. 응용프로그램 타일 변경 페이지로 이동합니다. 다음 화면 캡처에 나오는 대로 응용프로그램 타일의 일부 속성을 설정하고 응용프로그램 타일 속성 설정 버튼을 클릭합니다.

    AP_Tiles_ApplicationTileRunning
  3. 설정한 속성의 결과를 보려면 휴대폰 에뮬레이터에서 시작 버튼을 눌러 시작 화면으로 이동합니다. 응용프로그램 목록으로 이동하여 목록에서 TileSample을 찾습니다. TileSample을 길게 누른 다음 시작 화면에 고정을 선택합니다. 에뮬레이터가 시작 화면으로 이동하고 응용프로그램 타일이 추가됩니다. 이 타일은 위 단계에서 설정한 속성을 갖습니다.

  4. 휴대폰 에뮬레이터에서 뒤로 버튼을 눌러 응용프로그램으로 다시 이동합니다. 뒤로 버튼을 누르면 디버깅 세션이 종료되지 않습니다.

  5. 뒤로 버튼을 다시 눌러 응용프로그램의 MainPage로 이동합니다.

  6. SecondaryTile 페이지로 이동하고 보조 타일을 만드는 확인란을 선택합니다. 휴대폰이 자동으로 시작 화면으로 이동하고 새 타일이 표시됩니다.

  7. 휴대폰 에뮬레이터에서 뒤로 버튼을 눌러 응용프로그램으로 다시 이동합니다.

  8. Title 속성에 대한 새 값을 입력하고 제목 설정 버튼을 클릭합니다.

  9. 휴대폰 에뮬레이터의 시작 버튼을 눌러 시작 화면으로 다시 이동합니다. 새 Title 속성이 표시됩니다.

  10. 다시 뒤로 버튼을 누르고 다른 속성을 변경합니다.

    AP_Tiles_SecondaryTilesRunning
  11. 시작 화면에서 보조 타일을 탭합니다. TileSample 응용프로그램이 시작되고 SecondaryTile 페이지로 바로 이동합니다. Title의 기본값은 FromTile이 됩니다.

AP_Tiles_TileSampleRunningFront

AP_Tiles_TileSampleRunningBack

표시:
© 2014 Microsoft