ビハインドコードの作成
ビハインドコードでは、主にC1Accordionコントロールでヘッダーペインにマウスポインタを重ねるとコンテンツペインが展開する処理と、コンテンツペインに配置した各コントロールのイベントハンドラの処理を作成します。
コンテンツペインが展開する処理の作成
この処理は、C1AccordionコントロールのIsMouseOverChangedイベントハンドラで行います。このイベントハンドラは、ヘッダーペインにマウスポインタが重なると呼び出されます。コードからコンテンツペインを展開・縮小するには、IsExpandedプロパティを使用します。プロパティに「True」をセットするとコンテンツペインは展開し、「False」で閉じます。これを、メンバ変数を使って切り替えていきます。
Private flag As Boolean = True Private Sub accitem1_IsMouseOverChanged(ByVal sender As System.Object, ByVal e As C1.Silverlight.PropertyChangedEventArgs(Of System.Boolean)) If flag = True Then accitem1.IsExpanded = True flag = False Else accitem1.IsExpanded = False flag = True End If End Sub
private Boolean flag = true; private void accitem1_IsMouseOverChanged(object sender, C1.Silverlight.PropertyChangedEventArgs<bool> e) { if (flag == true) { accitem1.IsExpanded = true; flag = false; } else { accitem1.IsExpanded = false; flag = true; } }
コンテンツペインに配置した各コントロールの処理
これは、それぞれのコントロールのClickイベントハンドラで行います。処理そのものはごく簡単な処理で、テキストボックスに入力されたテキストのコピーやクリア、文字数のカウントを行います。
Partial Public Class MainPage Inherits UserControl Public col1 As Brush Public col2 As Brush Public Sub New() InitializeComponent() col1 = text1.Background col2 = text2.Background End Sub Private Sub button1_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) text1.SelectAll() End Sub Private Sub button2_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Dim s As String = text1.SelectedText text2.Text = s End Sub Private Sub button3_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) text1.Text = "" text2.Text = "" End Sub Private Sub button4_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) MessageBox.Show("文字数は" & text1.SelectionLength & "文字です", "文字数の表示", MessageBoxButton.OK) End Sub Private Sub check1_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) If check1.IsChecked = False Then text1.Background = New SolidColorBrush(Colors.Transparent) text2.Background = New SolidColorBrush(Colors.Transparent) Else text1.Background = col1 text2.Background = col2 End If End Sub End Class
namespace sl_accordion_cs { public partial class MainPage : UserControl { public Brush col1; public Brush col2; public MainPage() { InitializeComponent(); col1 = text1.Background; col2 = text2.Background; } private void button1_Click(object sender, RoutedEventArgs e) { text1.SelectAll(); } private void button2_Click(object sender, RoutedEventArgs e) { String s = text1.SelectedText; text2.Text = s; } private void button3_Click(object sender, RoutedEventArgs e) { text1.Text = ""; text2.Text = ""; } private void button4_Click(object sender, RoutedEventArgs e) { MessageBox.Show("文字数は" + text1.SelectionLength + "文字です", "文字数の表示", MessageBoxButton.OK); } private void check1_Click(object sender, RoutedEventArgs e) { if (check1.IsChecked == false) { text1.Background = new SolidColorBrush(Colors.Transparent); text2.Background = new SolidColorBrush(Colors.Transparent); } else { text1.Background = col1; text2.Background = col2; } } } }
まとめ
C1Accordionコントロールは、コンテンツペインを閉じたり広げたりできるので、Webページの操作系をだらだらと表示してページが乱雑になるのを防ぎ、すっきりとまとめることができます。Silverlight特有のアニメーション機能も使っているため、ページのデザインで苦労している方は一度試してみてはいかがでしょうか。