Cherie缺小瑞的部落格

Step1 : 新增一個UserControl 並在Grid中 新增"ScrollViewer"控制項，拉出一個適當的高度即可。並且名稱命名為:scrollViewer1；Grid的語法加入"x:Name="LayoutRoot" Loaded="LayoutRoot_Loaded"

Step2: 再繪製一個StackPanel區塊 ，也可以選其他的，因為stackPanel可以自動垂直水平排列。

區塊中間可以放置內容物

Step3: 在Layout中製作兩個上下的按鈕，圖形按鈕製作方法請參考:____________

Step4: 在CS檔宣告btnUp and btnDown 加入了 MouseEnter 還有 MouseLeave事件

這就像是timer 的東西..別忘記要先在CS檔中寫 using System.Windows.Threading;

以下紅字是新增的CODE:(紅字)

using System;

using System.Collections.Generic;

using System.Text;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Data;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Imaging;

using System.Windows.Navigation;

using System.Windows.Shapes;

using System.Windows.Threading;

namespace WpfApplication2

{

/// <summary>

/// UserControl1.xaml 的互動邏輯

/// </summary>

public partial class UserControl1 : UserControl

{

public UserControl1()

{

this.InitializeComponent();

}

private DispatcherTimer tmrDown;

private DispatcherTimer tmrUp;

private void LayoutRoot_Loaded(object sender, System.Windows.RoutedEventArgs e)

{

//Init tmrDown

tmrDown=new DispatcherTimer();

//每500毫秒跑一次

tmrDown.Interval = new TimeSpan(100);

//加入每次tick的事件

tmrDown.Tick += tmrDown_Tick;

tmrUp=new DispatcherTimer();

tmrUp.Interval=new TimeSpan(100);

tmrUp.Tick += tmrUp_Tick;

}

void tmrUp_Tick(object sender, EventArgs e)

{

//將VerticalOffset -10

scrollViewer1.ScrollToVerticalOffset(scrollViewer1.VerticalOffset - 0.5);

}

void tmrDown_Tick(object sender, EventArgs e)

{

//將 VerticalOffset +10 就會往下

scrollViewer1.ScrollToVerticalOffset(scrollViewer1.VerticalOffset + 0.5);

}

//向下的滑鼠進入事件

private void btnDown_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)

{

tmrDown.Start();

}

//向下的滑鼠移開事件

private void btnDown_MouseLeave(object sender, System.Windows.Input.MouseEventArgs e)

{

tmrDown.Stop();

}

//向上的滑鼠進入事件

private void btnUp_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)

{

tmrUp.Start();

}

//向上的滑鼠移開事件

private void btnUp_MouseLeave(object sender, System.Windows.Input.MouseEventArgs e)

{

tmrUp.Stop();

}

}

}

Step5: 回到控制項中，上下按鈕寫

<Button Content="往上" HorizontalAlignment="Left" Margin="286,136,0,0" VerticalAlignment="Top" Width="75" FontSize="14" Height="23" Name="btnUp" MouseEnter="btnUp_MouseEnter" MouseLeave="btnUp_MouseLeave" />

<Button Content="往下" FontSize="14" Height="23" HorizontalAlignment="Left" Margin="286,231,0,0" VerticalAlignment="Top" Width="75" Name="btnDown" MouseEnter="btnDown_MouseEnter" MouseLeave="btnDown_MouseLeave" />

Step5: 執行專案後會發現 scrollView有拉霸，且按鈕無法作用

點選ScrollViewer1 ,語法中寫入VerticalScrollBarVisibility="Hidden"

Step6: 完工

Step1: 這是內建的按鈕

Step2: 在主畫面繪製一個圓角矩形(步驟省略)，並按右鑑，將物件變成控制項

Step3 樣式命名

因為我們是要作按鈕的樣式，所以選擇控制項的類型為Button

並為這個樣式命名ButtonStyle01。

Step4 刪除ContentPresenter

此時會進入到Template編輯畫面中，將左側物件與時間軸中的

ContentPresenter 刪除

並新增一個TextBlock

Step5 接下來要設定兩件事

          5-1是滑鼠的狀態(一般、滑過)

          5-2是TextBlock的來源設定。

Step5-1 設定滑鼠一般、滑過、按下屬性

切換到”狀態(S)視窗”，點選MouseOver，會出現錄製動作。我們可以展開時間軸，新增影格後，直接改變滑鼠的顏色!

Step5-2文字來源聯繫

點選TextBlock,在一般屬性面板中，點選進階選項

將”範本繫結”選擇Content(如果成功，他會變成Button的文字)。

另外可以再設定Foreground字型的大小顏色等屬性

Step6 回到主畫面

按鈕完成，可自行變更文字Content

Step7 按鈕如何套用新樣式:

從控制項拉出按鈕後按右鍵，選擇編輯範本>套用資源>新的樣式名稱

END: CheckBox的原理也差不多，我做了一個測試，還挺可愛的! ^_^

>>>範例檔下載