Windows Phone 7 建立自訂的控制項

建立自訂的控制項：
需要從控制項（或 ContentControl）派生，至少，為了繼承基本的控制項功能，該控制項類應從 Silverlight System.Windows.Controls.Control 類派生。但是，它也可以從

ContentControl 和 ItemsControl 等 Control 衍生類別派生。許多內建控制項可以直接或間接從添加了 Content 屬性的 ContentControl 派生，而該屬性允許對控制項的內容（如按壓

按鈕表面上的內容）進行自訂。ListBox 控制項則從 ItemsControl 派生，ItemsControl 可以實現用來向使用者提供項目集合的控制項的基本行為。因為我們要實現按鈕，所以將從

ContentControl 派生。
代碼結構如下：
namespace SimpleButtonDemo
{
    public class SimpleButton : ContentControl
    {
    }
}

此時，您已實現了單純的自訂控制項，該控制項可在 XAML 文檔中通過聲明進行執行個體化。為了說明此問題，將下列語句添加到 Page.xaml：
<local:SimpleButton />
為了使 Silverlight 可以識別此聲明，您還需要將以下屬性添加到 Page.xaml 的根 UserControl 元素：
xmlns:local="clr-namespace:SimpleButtonDemo;"
您可以看到，clr-namespace 能夠識別在其中定義 SimpleButton 類的命名空間，而程式集可以識別包含此控制項的程式集。
在xaml中就可以調用該控制項了，代碼結構如下：
    <Grid x:Name="LayoutRoot" Background="White">
      <local:SimpleButton />
    </Grid>

執行個體：

NaiveGradientButton類

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;

namespace NaiveGradientButtonDemo
{
public class NaiveGradientButton : Button
    {
        GradientStop gradientStop1, gradientStop2;

public NaiveGradientButton()
        {
            LinearGradientBrush brush = new LinearGradientBrush();
            brush.StartPoint = new Point(0, 0);
            brush.EndPoint = new Point(1, 0);

            gradientStop1 = new GradientStop();
            gradientStop1.Offset = 0;
            brush.GradientStops.Add(gradientStop1);

            gradientStop2 = new GradientStop();
            gradientStop2.Offset = 1;
            brush.GradientStops.Add(gradientStop2);

            Foreground = brush;
        }

public Color Color1
        {
set { gradientStop1.Color = value; }
get { return (Color)gradientStop1.Color; }
        }

public Color Color2
        {
set { gradientStop2.Color = value; }
get { return (Color)gradientStop2.Color; }
        }
    }
}

xaml中添加引用

xmlns:local="clr-namespace:NaiveGradientButtonDemo"

<!--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="NAIVEGRADIENTBUTTON DEMO" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="main page" 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">
<StackPanel>
<local:NaiveGradientButton Content="Naive Gradient Button #1"
                                           HorizontalAlignment="Center" />

<local:NaiveGradientButton Content="Naive Gradient Button #2"
                                           Color1="Blue" Color2="Red"
                                           HorizontalAlignment="Center" />

<local:NaiveGradientButton Content="Naive Gradient Button #3"
                                           Color1="{StaticResource PhoneForegroundColor}"
                                           Color2="{StaticResource PhoneBackgroundColor}"
                                           HorizontalAlignment="Center" />

<local:NaiveGradientButton Content="Naive Gradient Button #4"
                                           Style="{StaticResource gradientButtonStyle}" />
</StackPanel>
</Grid>
</Grid>