Windows Phone - 圓形按鈕觸摸動畫

我用Blend創建了一個圓形按鈕。它運行良好，但不響應觸摸事件。該按鈕應該變小一些，並將不透明度設置爲1.0，類似於諾基亞地圖應用程序的位置按鈕。Windows Phone - 圓形按鈕觸摸動畫

這是我現有的控件模板：

 <ControlTemplate x:Key="RoundButtonTemplate" TargetType="Button"> 
     <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="50" Margin="{StaticResource PhoneTouchTargetOverhang}"> 
      <ContentControl x:Name="ContentContainer" Content="{TemplateBinding Content}" RenderTransformOrigin="0.5,0.5"> 
       <ContentControl.RenderTransform> 
        <ScaleTransform x:Name="buttonScale" /> 
       </ContentControl.RenderTransform> 
      </ContentControl> 
     </Border> 
    </ControlTemplate>

什麼是正確的故事板以及它需要插入？

來源

2013-02-23 c.z

我建議的第一件事就是使用Ellipse而不是帶圓邊的邊框創建圓。這樣，如果您決定按鈕的尺寸不同，則無需繼續調整CornerRadius。你可以像這樣重疊的橢圓和ContentPresenter在網格：

<ControlTemplate TargetType="Button"> 
    <Grid Background="Transparent"> 
     <Ellipse HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/> 
     <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/> 
    </Grid> 
</ControlTemplate>

要更改按鈕視覺上的反應如何摸，你應該在混合使用可視狀態。打開按鈕模板後，單擊States選項卡（或者如果不可見，請轉至窗口|狀態）。

如果您打開了按鈕模板，則應該看到幾個內置的可視狀態供您編輯。選擇按下狀態，您將進入錄製模式。按下按鈕後，您所做的任何模板更改都會顯示。由於主內容窗口周圍有紅色輪廓和通知，因此可以告訴您處於錄製模式。

在此狀態下，按下按鈕時更改要查看的內容。在你的情況下，將橢圓不透明度設置爲100％，並將Grid上的Scale Scale設置爲更小的符合您需要的東西。

確保您單擊狀態標籤中的基地退出錄製模式。

現在，當您在運行時按下按鈕時，您記錄的更改應該顯示出來。他們也是瞬間的。要在狀態之間進行良好的轉換，請返回到狀態選項卡。然後單擊按下狀態旁邊的添加轉換按鈕。

enter image description here

添加過渡爲- >壓，並Pressed->。這些是您進入和離開按下狀態時將發揮的轉換。在這裏您可以編輯轉換持續時間和緩動功能。

enter image description here

個人而言，我通常會做0.2S左右的東西，與二次易於輸入/輸出。現在當你按下按鈕時，不同視覺狀態之間應該有一個輕微的動畫。

祝你好運！

來源

2013-02-23 15:43:26

真的很好的解釋！十分感謝！ :) – 2013-02-23 17:20:32

Windows Phone - 圓形按鈕觸摸動畫

回答

相關問題