创建自定义的控件：

需要从控件（或 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 的根 User­Control 元素：

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

>