SilverLight学习笔记二accordion控件(SilverLight手风琴)

accordion是SilverLight布局控件中的手风琴样式。

界面

 

下面在例子中学习

 

1.AccordionSample.xaml

<UserControl x:Class="Silverlight.Common.AccordionSample"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:layoutToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Layout.Toolkit"
    xmlns:system="clr-namespace:System;assembly=mscorlib">
    <StackPanel>

        <Grid Background="White" Width="600" Height="700" x:Name="MainGrid" 
            <Grid.ColumnDefinitions>
                <ColumnDefinition  Width="auto"/>
                <ColumnDefinition  Width="10"/>
                <ColumnDefinition  Width="auto"/>
                <ColumnDefinition  Width="10"/>
                <ColumnDefinition  Width="100" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions >
                <RowDefinition Height="auto" />
                <RowDefinition Height="auto" />
                <RowDefinition Height="auto" />
                <RowDefinition Height="auto" />
                <RowDefinition Height="32*" />
                <RowDefinition Height="568*" />
            </Grid.RowDefinitions>

            <layoutToolkit:Accordion x:Name="accordion" Grid.Column="0" Grid.RowSpan="5">
                <layoutToolkit:AccordionItem Content="菜单1" Header="Sliverlight1.0" Margin="0,0,0,0"/>
                <layoutToolkit:AccordionItem Content="菜单2" Header="Sliverlight2.0"/>
                <layoutToolkit:AccordionItem Content="菜单3" Header="Sliverlight3.0"/>
                <layoutToolkit:AccordionItem Content="菜单4" Header="Sliverlight4.0"/>
                <system:String>regular string item 3</system:String>
            </layoutToolkit:Accordion>
            <layoutToolkit:Accordion x:Name="accordion1" Grid.Column="0" Grid.Row="6">
        
            </layoutToolkit:Accordion>
            <TextBlock x:Name="txbExpandDirection" Text="折叠样式：" HorizontalAlignment="Center" VerticalAlignment="Center"  Grid.Column="2" Grid.Row="0"></TextBlock>
            <ComboBox  x:Name="cmbExpandDirection" Width="100" Height="30" Grid.Column="4" Grid.Row="0" SelectionChanged="cmbExpandDirection_SelectionChanged">
                <ComboBoxItem Content="Up"></ComboBoxItem>
                <ComboBoxItem Content="Down"></ComboBoxItem>
                <ComboBoxItem Content="Left"></ComboBoxItem>
                <ComboBoxItem Content="Right"></ComboBoxItem>
            </ComboBox>

            <TextBlock x:Name="txbBorderThickness" Text="边框宽度：" HorizontalAlignment="Center" VerticalAlignment="Center"  Grid.Column="2" Grid.Row="1"></TextBlock>
            <TextBox x:Name="txtBorderThicknessValue" Grid.Column="4" Grid.Row="1" TextChanged="txtBorderThicknessValue_TextChanged"></TextBox>
            <TextBlock x:Name="txbBorderBrush" Text="Flow样式：" HorizontalAlignment="Center" VerticalAlignment="Center"  Grid.Column="2" Grid.Row="2"></TextBlock>
            <ComboBox  x:Name="cmbFlowDirection" Width="100" Height="30" Grid.Column="4" Grid.Row="2" SelectionChanged="cmbFlowDirection_SelectionChanged">
                <ComboBoxItem Content="LeftToRight"></ComboBoxItem>
                <ComboBoxItem Content="RightToLeft"></ComboBoxItem>
            </ComboBox>

            <TextBlock x:Name="txbItemSource" Text="数据源：" HorizontalAlignment="Center" VerticalAlignment="Center"  Grid.Column="2" Grid.Row="3"></TextBlock>
            <CheckBox x:Name="cbItemSource" Grid.Column="6" Grid.Row="3" Checked="cbItemSource_Checked"
                     HorizontalAlignment="Center" VerticalAlignment="Center">
            </CheckBox>
        </Grid>

    </StackPanel>
</UserControl>

 

2.AccordionSample.xaml.cs

 

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;

namespace Silverlight.Common
{
    public partial class AccordionSample : UserControl
    {
        public AccordionSample()
        {
            InitializeComponent();
        }

        private void cmbExpandDirection_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            switch (this.cmbExpandDirection.SelectedIndex)
            {
                case 0:
                    this.accordion.ExpandDirection=ExpandDirection.Up;
                    break;

                    case 1:
                    this.accordion.ExpandDirection=ExpandDirection.Down;
                    break;

                    case 2:
                    this.accordion.ExpandDirection = ExpandDirection.Left;
                    break;

                default:
                    this.accordion.ExpandDirection = ExpandDirection.Right;
                    break;
            }
        }

        private void txtBorderThicknessValue_TextChanged(object sender, TextChangedEventArgs e)
        {
            int thicknessValue=Convert.ToInt32(this.txtBorderThicknessValue.Text);
            if (thicknessValue > 0)
            {
                this.accordion.BorderThickness = new Thickness(thicknessValue);
            }
        }

        private void cmbFlowDirection_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
             switch (this.cmbFlowDirection.SelectedIndex)
            {
                case 0:
                    this.accordion.FlowDirection=FlowDirection.RightToLeft;
                    break;

                default:
                    this.accordion.FlowDirection = FlowDirection.LeftToRight;
                    break;
            }
        }

        private void cbItemSource_Checked(object sender, RoutedEventArgs e)
        {

　　　　//CheckBox被选中
            if ((bool)this.cbItemSource.IsChecked)
            {
                this.accordion1.ItemsSource = DataSource.GetDataSource();
                this.cbItemSource.IsEnabled = false;
            }
}
    }
}

 

3.DataSource.cs

using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Collections;
using System.Collections.Generic;

namespace Silverlight.Common
{

//数据源类
    public static class DataSource
    {
        public static IList<string> GetDataSource()
        {
            IList<string> list=new List<string>();
            list.Add("系统管理");
            list.Add("用户管理");
            list.Add("帮助");
            return list;
        }
    }
}

 源码下载：http://files.cnblogs.com/salam/Silverlight.Common.rar