Windows Phone 7平臺開發(fā)日歷應(yīng)用程序教程

作者：加菲貓 2011-04-08 10:02:06

Windows Phone 7是微軟發(fā)布的手機操作系統(tǒng)，與諾基亞合作使它成為備受關(guān)注的平臺。今天我們將給大家介紹如何在Windows Phone 7平臺上開發(fā)日歷應(yīng)用程序，該日歷程序?qū)崿F(xiàn)的功能包括顯示當(dāng)前的日期，并可通過上下按鈕來查看不同月份的日期。

在Windows Phone 7上實現(xiàn)一個日歷的程序有很多種的方式，下面將用一種很簡單的方法來實現(xiàn)一個日歷的應(yīng)用程序。日歷主體是用一個WrapPanel面板加上多了Button控件來實現(xiàn)的，每個日期用一個Button來表示。WrapPanel根據(jù)其中Button元素的尺寸和其自身可能的大小自動地把其中的Button元素排列到下一行或下一列。該日歷程序?qū)崿F(xiàn)的功能包括顯示當(dāng)前的日期，可以通過上下按鈕來查看不同月份的日期。

<phone:PhoneApplicationPage     
 
    x:Class="CalendarControl.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:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"   
 
    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">    
 
     
 
    <phone:PhoneApplicationPage.Resources>    
 
        <ResourceDictionary>    
 
            <ResourceDictionary.MergedDictionaries>    
 
                <ResourceDictionary Source="style.xaml"/>    
 
            </ResourceDictionary.MergedDictionaries>    
 
        </ResourceDictionary>    
 
    </phone:PhoneApplicationPage.Resources>    
 
         
 
    <!--LayoutRoot is the root grid where all page content is placed-->    
 
    <Grid x:Name="LayoutRoot" Background="Firebrick">    
 
        <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="PageTitle" Text="日歷" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" Height="90" />    
 
        </StackPanel>    
 
     
 
        <!--ContentPanel - place additional content here-->    
 
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">    
 
            <Grid>    
 
                <Grid>    
 
                    <Button x:Name="BackBtn" VerticalAlignment="Top" HorizontalAlignment="Left" Style="{StaticResource RoundButton}" Height="72" Width="72" Margin="27,1,0,0" Click="OnChangeMonth" BorderBrush="White">    
 
                        <Image Source="/CalendarControl;component/Images/appbar.back.png" Height="42" Width="42" VerticalAlignment="Top" HorizontalAlignment="Left" />    
 
                    </Button>    
 
                    <TextBlock x:Name="MonthYear" Text="November 2010" Style="{StaticResource PhoneTextLargeStyle}" Margin="101,14,124,0" HorizontalAlignment="Center" VerticalAlignment="Top" Width="231" TextAlignment="Center" Foreground="White"/>    
 
                    <Button x:Name="NextBtn" VerticalAlignment="Top" HorizontalAlignment="Right" Style="{StaticResource RoundButton}" Height="72" Width="74" Margin="0,0,45,0" Click="OnChangeMonth" Foreground="White" BorderBrush="White">    
 
                        <Image Source="/CalendarControl;component/Images/appbar.next.png" Height="42" Width="42" VerticalAlignment="Top" HorizontalAlignment="Right" />    
 
                    </Button>    
 
                </Grid>    
 
                <ListBox x:Name="CalendarListBox" Margin="1,78,0,70" Height="459">    
 
                    <ListBoxItem Margin="12,0,0,0">    
 
                        <toolkit:WrapPanel x:Name="CalendarWrapPanel" HorizontalAlignment="Left" VerticalAlignment="Top"/>    
 
                    </ListBoxItem>    
 
                </ListBox>    
 
            </Grid>    
 
     
 
        </Grid>    
 
    </Grid>    
 
</phone:PhoneApplicationPage>   
 
view sourceprint?using System;    
 
using System.Collections.Generic;    
 
using System.Linq;    
 
using System.Net;    
 
using System.Windows;    
 
using System.Windows.Controls;    
 
using System.Windows.Documents;    
 
using System.Windows.Input;    
 
using System.Windows.Media;    
 
using System.Windows.Media.Animation;    
 
using System.Windows.Shapes;    
 
using Microsoft.Phone.Controls;    
 
using Microsoft.Phone.Shell;    
 
     
 
namespace CalendarControl    
 
{    
 
    public partial class MainPage : PhoneApplicationPage    
 
    {    
 
        DateTime? _entryDate = DateTime.Now;//"?"加上之后表示可以有空值（null） Nullable<T>    
 
     
 
        public MainPage()    
 
        {    
 
            InitializeComponent();    
 
            InitializeCalendar(_entryDate.Value);//第一次進入日歷程序  初始化當(dāng)前日期的顯示    
 
        }    
 
     
 
        /// <summary>    
 
        ///月份前進后退事件      
 
        /// </summary>    
 
        /// <param name="sender"></param>    
 
        /// <param name="e"></param>    
 
        private void OnChangeMonth(object sender, RoutedEventArgs e)    
 
        {    
 
            if (((Button)sender).Name == "NextBtn")//如果是點擊下一個月的按鈕    
 
                _entryDate_entryDate = _entryDate.Value.AddMonths(1);    
 
            else   
 
                _entryDate_entryDate = _entryDate.Value.AddMonths(-1);    
 
     
 
            CalendarListBox.Visibility = Visibility.Collapsed;    
 
     
 
            //初始化該日期的顯示    
 
            InitializeCalendar(_entryDate.Value);    
 
        }    
 
     
 
        /// <summary>    
 
        ///  初始化日歷不同月份的日期     
 
        /// </summary>    
 
        /// <param name="entryDate"></param>    
 
        protected void InitializeCalendar(DateTime entryDate)    
 
        {    
 
            MonthYear.Text = String.Format("{0:yyyy年 MM月 }", _entryDate.Value);    
 
     
 
            DateTime todaysDate = DateTime.Now;    
 
     
 
            int numDays = DateTime.DaysInMonth(entryDate.Year, entryDate.Month);//獲取顯示的月份的天數(shù)    
 
     
 
            int count = CalendarWrapPanel.Children.Count;//CalendarWrapPanel面板中檢查按鈕的數(shù)量    
 
            if (count > numDays)    
 
            {//從最后減去多余的日期的按鈕   日期用的是按鈕控件    
 
                for (int i = 1; i <= count - numDays; i++)    
 
                    CalendarWrapPanel.Children.RemoveAt(count - i);    
 
            }    
 
            else   
 
            {//從最后加上缺少的日期的按鈕    
 
                int start = count + 1;    
 
                for (int i = start; i <= numDays; i++)    
 
                {    
 
                    Border border = new Border();    
 
                    border.Background = new SolidColorBrush(Color.FromArgb(255, 103, 183, 212));    
 
                    border.Margin = new Thickness(0, 0, 5, 5);    
 
                    border.Width = 80;    
 
                    border.Height = 80;    
 
                    border.CornerRadius = new CornerRadius(20);    
 
     
 
                    Button btn = new Button();    
 
                    btn.Name = "Day" + i;    
 
                    btn.Content = i.ToString();    
 
                    btn.BorderBrush = new SolidColorBrush(Colors.Transparent);    
 
                    btn.Width = 75;    
 
                    btn.Height = 75;    
 
                    btn.FontSize = 25;    
 
                    border.Child = btn;//Button放進Border里面    
 
                    btn.Style = this.Resources["HasDataButtonStyle"] as Style;    
 
     
 
                    CalendarWrapPanel.Children.Add(border);//將按鈕添加到面板中    
 
                }    
 
            }    
 
     
 
            for (int i = 0; i < numDays; i++)    
 
            {    
 
                Border border = (Border)CalendarWrapPanel.Children[i];    
 
                if (border != null)    
 
                {    
 
                    Button btn = (Button)border.Child;    
 
     
 
                    DateTime currDate = new DateTime(entryDate.Year, entryDate.Month, i + 1);    
 
                    //如果是日期是今天則設(shè)置日期的按鈕為橙色    
 
                    if (currDate.Date.CompareTo(DateTime.Now.Date) == 0)    
 
                    {    
 
                        border.Background = new SolidColorBrush(Color.FromArgb(255, 255, 165, 0));    
 
                        btn.Style = this.Resources["TodayHasDataButtonStyle"] as Style;    
 
                       // isToday = true;    
 
                    }    
 
                    else   
 
                    {    
 
                        border.Background = new SolidColorBrush(Color.FromArgb(255, 103, 183, 212));    
 
                    }    
 
                }    
 
            }    
 
            CalendarWrapPanel.UpdateLayout();//更新CalendarWrapPanel的顯示     
 
            CalendarListBox.Visibility = Visibility.Visible;//設(shè)置為可見    
 
     
 
        }    
 
    }    
 
}

通過以上的代碼，你將實現(xiàn)下圖所示的日歷應(yīng)用。

【編輯推薦】

綁定在Windows Phone 7的靜態(tài)類
不編程也開發(fā) 無代碼開發(fā)Windows Phone 7應(yīng)用工具
使用IronRuby開發(fā)Windows Phone 7應(yīng)用程序
Windows Phone 7應(yīng)用程序統(tǒng)計 65%是付費下載
Windows Phone 7設(shè)計評測報告

責(zé)任編輯：佚名來源：博客園

日歷 Windows Phone 7