WPF自定義漂亮的按鈕樣式(3)_.Net教程
      
編輯Tag賺U幣
      


      教程Tag：暫無Tag,歡迎添加,賺取U幣!
      


      

      推薦：裝箱、轉型、方法調用他們究竟有什么區別？
      以下為引用的內容：
裝箱、轉型、方法調用這些我們天天進行的日常工作之前到底有什么差別？

        

    







    

        

            以
      


      再來看看這個命名為“fore”的 Border 元素，它實現的是按鈕的邊框和高亮反光效果，我為它設置了一個半透明的黑色1像素邊框，使得這個邊框的色彩可以和背景色混合起來。
      


      


      

    

        
      

            以下為引用的內容：
       <Border.Background>
                                          <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                              <GradientBrush.GradientStops>
                                                  <GradientStopCollection>
                                                      <GradientStop Color="#6FFF" Offset="0.5"/>
                                                      <GradientStop Color="#1111" Offset="0.51"/>
                                                  </GradientStopCollection>
                                              </GradientBrush.GradientStops>
                                          </LinearGradientBrush>
                                      </Border.Background>      		

        
      

          


      


      


      它的背景同樣采用的漸變筆刷，起始值和終止值的位置幾乎貼在一起，從而形成比較鮮明的反光度對比。
      


      


      ContentPresenter 元素用于呈現按鈕原本的內容，對于按鈕來說就是按鈕上的文字了，當然也可能會存在圖片或其它東西。
      


      


      

    

        
      

            以下為引用的內容：
       <ContentPresenter.BitmapEffect>
                                              <DropShadowBitmapEffect Color="#000" Direction="-90" ShadowDepth="2" Softness="0.1" Opacity="0.3" />
                                          </ContentPresenter.BitmapEffect>      		

        
      

          


      


      


      我為之加了一個不太明顯的陰影濾鏡以增強顯示效果。
      


      


      剩下的就是些可愛又該死的 Trigger ，我們通過這些觸發器來改變按鈕在不同狀態時的外觀。
      


      


      

    

        
      

            以下為引用的內容：
            <!--鼠標移入移出-->
                                  <Trigger Property="IsMouseOver" Value="True">
                                      <Trigger.EnterActions>
                                          <BeginStoryboard>
                                              <Storyboard>
                                                  <DoubleAnimation To="6" Duration="0:0:0.2" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)" />
                                                  <ColorAnimation To="#AFFF" BeginTime="0:0:0.2" Duration="0:0:0.2" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)" />
                                                  <ColorAnimation To="#3FFF" BeginTime="0:0:0.2" Duration="0:0:0.2" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)" />
                                              </Storyboard>
                                          </BeginStoryboard>
                                      </Trigger.EnterActions>
                                      <Trigger.ExitActions>
                                          <BeginStoryboard>
                                              <Storyboard>
                                                  <DoubleAnimation Duration="0:0:0.2" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)" />
                                                  <ColorAnimation Duration="0:0:0.2" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)" />
                                                  <ColorAnimation Duration="0:0:0.2" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)" />
                                              </Storyboard>
                                          </BeginStoryboard>
                                      </Trigger.ExitActions>
                                  </Trigger>      		

        
      

          


      


      


      在鼠標移入按鈕時，我依次創建了改變外發光效果大小、改變上部反光區域顏色、改變下部反光區域顏色的動畫，這里的要點就在于“Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)"”屬性設置語句，琢磨一下你就能看出這是對屬性路徑的描述，只不過它們寫起來和看起來都很讓人生氣。
      


      


      

    

        
      

            以下為引用的內容：
                             <!--按鈕按下彈起-->
                                  <Trigger Property="IsPressed" Value="True">
                                      <Trigger.EnterActions>
                                          <BeginStoryboard>
                                              <Storyboard>
                                                  <DoubleAnimation To="3" Duration="0:0:0.1" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)" />
                                                  <ColorAnimation To="#3AAA" Duration="0:0:0.1" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)" />
                                                  <ColorAnimation To="#2111" Duration="0:0:0.1" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)" />
                                              </Storyboard>
                                          </BeginStoryboard>
                                      </Trigger.EnterActions>
                                      <Trigger.ExitActions>
                                          <BeginStoryboard>
                                              <Storyboard>
                                                  <DoubleAnimation Duration="0:0:0.1" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)" />
                                                  <ColorAnimation Duration="0:0:0.1" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)" />
                                                  <ColorAnimation Duration="0:0:0.1" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)" />
                                              </Storyboard>
                                          </BeginStoryboard>
                                      </Trigger.ExitActions>
                                  </Trigger>      		

        
      

          


      


      


      按下和彈起按鈕時，我們做了相似的動畫改變，與前面相比只是數值略微不同。
      


      


      

    

        
      

            以下為引用的內容：
      <!--按鈕失效-->
                                  <Trigger Property="IsEnabled" Value="False">
                                      <Setter Property="Foreground" Value="#B444"/>
                                      <Trigger.EnterActions>
                                          <BeginStoryboard>
                                              <Storyboard>
                                                  <DoubleAnimation To="0" Duration="0:0:0.3" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)" />
                                                  <DoubleAnimation To="1" Duration="0:0:0.1" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Opacity)" />
                                                  <DoubleAnimation To="-135" Duration="0:0:0.1" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Direction)" />
                                                  <ColorAnimation To="#FFF" Duration="0:0:0.3" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Color)" />
                                                  <ColorAnimation To="#D555" Duration="0:0:0.3" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" />
                                                  <ColorAnimation To="#CEEE" Duration="0:0:0.3" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)" />
                                                  <ColorAnimation To="#CDDD" Duration="0:0:0.3" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)" />
                                              </Storyboard>
                                          </BeginStoryboard>
                                      </Trigger.EnterActions>
                                      <Trigger.ExitActions>
                                          <BeginStoryboard>
                                              <Storyboard>
                                                  <DoubleAnimation Duration="0:0:0.1" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)" />
                                                  <DoubleAnimation Duration="0:0:0.1" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Opacity)" />
                                                  <DoubleAnimation Duration="0:0:0.1" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Direction)" />
                                                  <ColorAnimation Duration="0:0:0.1" Storyboard.TargetName="content" Storyboard.TargetProperty="(ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Color)" />
                                                  <ColorAnimation Duration="0:0:0.1" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" />
                                                  <ColorAnimation Duration="0:0:0.1" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)" />
                                                  <ColorAnimation Duration="0:0:0.1" Storyboard.TargetName="fore" Storyboard.TargetProperty="(Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)" />
                                              </Storyboard>
                                          </BeginStoryboard>
                                      </Trigger.ExitActions>
                                  </Trigger>      		

        
      

          


      


      


      當按鈕失效時，我要改變很多東西，首先將文字顏色設為灰色，然后依次創建了改變外發光效果大小、改變內容陰影效果不透明度、改變內容陰影效果角度、改變內容陰影效果顏色、改變按鈕邊框顏色、改變上部反光區域顏色、改變下部反光區域顏色的動畫。
      


      這里將先前對內容應用的陰影效果徹底改變，使之產生凹陷的效果。
      


      好了，到這里就下課啦，文章有點冗長了，但應該對新手很有幫助，老鳥估計現在已經夢游仙境了吧。
      分享：使用Ajax后，原來導出功能失敗的解決方法
      問題描述：我們的產品在Ajax后（使用微軟的UpdatePanel）,其中的導出功能出現錯誤。因為導出功能使用了Response直接輸出內容，而Ajax的異步方式對此不能解析導致出現錯誤。

解決過程：在網上
      


      

      共3頁上一頁123下一頁
      


      來源：模板無憂//所屬分類：.Net教程/更新時間：2008-08-22


      


      



      


      



      相關.Net教程：