WPF2008/10/21 14:26

오늘은 Slide형태의 메뉴를 구현 해보도록 하겠습니다. 예전에 옥션이였나 G마켓이였나에서 본적이 있는 메뉴인데 생각이 나서 만들어 보았습니다. 아래는 시연동영상입니다.



1~6번까지 메뉴가 있으며 해당 번호를 클릭하면 슬라이드 되면세 해당 위치로 이동하게됩니다. 메뉴하나하나에 광고를 넣어서 광고용으로 사용해도 될것같습니다.  XAML을 사용해서 기본적인 내용을 구성했으며 C#에서는 이벤트에 따른 Animation호출 부분을 구현했습니다. 먼저 아래는 XAML 소스코드입니다.


    
        
    
    
        
            
                
                
                
                
                
                
            
        
        
        
            
                
            
            
            
            
            
            
            
        

    



다음은 C# 코드입니다.

private void Button_Click(object sender, RoutedEventArgs e)
{

    DoubleAnimation MoveAnimation = Resources["MoveAnimation"] as DoubleAnimation;
    TextBlock SelectedTextBlock = sender as TextBlock;
    MoveAnimation.To = -(int.Parse(SelectedTextBlock.Text) - 1) * 600;

    Panels.BeginAnimation(Canvas.LeftProperty, MoveAnimation,HandoffBehavior.Compose);
}



크기가 일정한 내용의 메뉴 페이지를 StackPanel을 사용해 순차적으로 쌓아놓고 버튼을 클릭하면 버튼에 많는 만큼 StackPanel을 이동하는 방법을 이용해 구현 했습니다. 간단하죠? 기타 질문은 리플이나 메일로 주시면 답변해드리겠습니다 ^^


크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by 곡스
TAG , ,