Xamarin UWP - ボタン上にカーソルを置いたときに表示される枠線を取り除く方法

Question

私はXamarin.Formsモバイルアプリを開発中です。

問題がある：私はボタンにカーソルを合わせるとUWPバージョンでは、〜2ピクセルグレーの枠が表示されますホバリングないとき、境界線が今の空きスペースの量を残して、離れて行く（またはおそらく境界線が透明になります）、ボタンがその上にある要素と少しずれて見えることがあります。

どのように（ホバリング時とホバリング時でなく）その境界を完全に取り除くことができますか？

私は、カスタムレンダラ（ButtonExt : Button）を使用していて、PCLのデフォルトのスタイルで、私はこのような（除外、同様に無効と焦点を当てた状態では、デフォルトでnew Thickness(0)にBorderWidthPropertyを設定しています明快にするために他のスタイルのプロパティ）：

public static Style ButtonStyle => new Style(typeof(ButtonExt)) 
{ 
    Setters = 
    { 
     new Setter {Property = ButtonExt.BorderWidthProperty, Value = new Thickness(0)} 
    }, 
    Triggers = 
    { 
     // Disabled button 
     new Trigger(typeof(ButtonExt)) 
     { 
      Property = VisualElement.IsEnabledProperty, 
      Value = false, 
      Setters = 
      { 
       new Setter {Property = ButtonExt.BorderWidthProperty, Value = new Thickness(0)} 
      } 
     }, 
     new Trigger(typeof(ButtonExt)) 
     { 
      Property = VisualElement.IsFocusedProperty, 
      Value = true, 
      Setters = 
      { 
       new Setter {Property = ButtonExt.BorderWidthProperty, Value = new Thickness(0)} 
      } 
     } 
    } 
}; 

しかし、それは効果がありません。私が明示的にネイティブのコントロールの境界線の太さを0 - Control.BorderThickness = new Thickness(0);に設定した場合のみ動作します。しかし、それは少しハッキリです。理想的には、スタイルを通してその境界線を削除する方法があります。

Answer 1

カスタムレンダラを使用してこの機能を実現する必要はありません。 Xamarin.FormsボタンはBorderWidthプロパティを持ち、ネイティブボタンBorderThicknessPropertyに基づいて設計されています。だからあなたはそれを直接使うことができます。

<Button Text="Welcome" BorderWidth="0" 
    VerticalOptions="CenterAndExpand" 
    HorizontalOptions="CenterAndExpand" Clicked="Button_Clicked" /> 

この機能を実現するためにButtonスタイルを使用している場合は、ResourceDictionaryでXAMLボタンのスタイルを作成することができます。

<ResourceDictionary> 
    <Style x:Key="buttonStyle" TargetType="Button"> 
     <Setter Property="HorizontalOptions" Value="Center" /> 
     <Setter Property="VerticalOptions" Value="CenterAndExpand" /> 
     <Setter Property="BorderColor" Value="Lime" /> 
     <Setter Property="BorderRadius" Value="0" /> 
     <Setter Property="BorderWidth" Value="0" /> 
     <Setter Property="WidthRequest" Value="200" /> 
     <Setter Property="TextColor" Value="Teal" /> 
    </Style> 
</ResourceDictionary> 

使い方は

<Button Text="Welcome" Style="{StaticResource buttonStyle}"/> 

また、背後にあるコードでスタイルを使用することができます。

MyButton.Style = App.Current.Resources["buttonStyle"] as Style; 

更新

あなたのケースで述べたようにあなたはまた、カスタムボタンをレンダリングすることができ、しかし、BorderWidthPropertyのタイプはdoubleです。あなたはValue = new Thickness(0)からValue = 0に変更することができます。これは動作します。

public CustomButton() 
{ 
    this.Style = ButtonStyle; 
} 

public static Style ButtonStyle => new Style(typeof(Button)) 
{ 
    Setters = 
    { 
    new Setter {Property = Button.BorderWidthProperty, Value = 0}, 
    new Setter{ Property = Button.BorderColorProperty,Value = Color.Red} 
    } 
}