बटन क्रॉम सीमा को कैसे हटाएं (सीमा के टेम्पलेट को परिभाषित करते समय)?

Question

मैंने ChrisFhere का पालन किया और simple demo लिखें।

... अभिव्यक्ति मिश्रण में अपनी परियोजना को खोलते हैं, बटन और फिर सही क्लिक करें और "टेम्पलेट संपादन> एक कॉपी संपादित करें .."। यह मौजूदा टेम्पलेट को कॉपी करता है जिसे आप संशोधित कर सकते हैं। यह आसान है यदि आप इसे संसाधन शब्दकोश में बनाते हैं।

और मैं पीछे के स्क्रीन नीचे स्क्रीनशॉट के रूप में बटन के टेम्पलेट (संसाधन में ButtonChrome) देख सकते हैं।

मैं ButtonChromeकी सफेद ढाल सीमा हटाने और बटन के यूआई का सब कुछ रहने के रूप में है रखना चाहते हैं। मैं उसे कैसे कर सकता हूँ?

ps। समस्या को सरल बनाने के लिए मैं बटन दृश्य को अपने दृश्य पर सामान्य नियंत्रण के रूप में उपयोग करता हूं। मैं गुणों को ब्राउज़ करता हूं लेकिन अभी भी कोई विचार नहीं मिला कि "सफेद" सीमा को कहां से हटाया जाए।

(ButtonChrome में उपयोग)

(संसाधन में ButtonChrome)

Answer 1

मैं वहाँ एक आसान तरीका है कि सफ़ेद बॉर्डर से छुटकारा पाने के लिए है नहीं लगता है:

यहाँ एक उदाहरण है। वास्तविक दिनचर्या जिसे DrawInnerBorder कहा जाता है और इसे बटन क्रॉम में ऑनरेंडर के भीतर से बुलाया जाता है।

protected override void OnRender(DrawingContext drawingContext) 
{ 
    Rect bounds = new Rect(0.0, 0.0, base.ActualWidth, base.ActualHeight); 
    this.DrawBackground(drawingContext, ref bounds); 
    this.DrawDropShadows(drawingContext, ref bounds); 
    this.DrawBorder(drawingContext, ref bounds); 

    // This one draws the white Rectangle 
    this.DrawInnerBorder(drawingContext, ref bounds); 
} 

private void DrawInnerBorder(DrawingContext dc, ref Rect bounds) 
{ 
    if ((base.IsEnabled || this.RoundCorners) && ((bounds.Width >= 4.0) && (bounds.Height >= 4.0))) 
    { 
     Pen innerBorderPen = this.InnerBorderPen; 
     if (innerBorderPen != null) 
     { 
      dc.DrawRoundedRectangle(null, innerBorderPen, new Rect(bounds.Left + 1.5, bounds.Top + 1.5, bounds.Width - 3.0, bounds.Height - 3.0), 1.75, 1.75); 
     } 
    } 
} 

हम देख सकते हैं, वहाँ इसे निष्क्रिय करने के लिए कोई संपत्ति है। आप बटन क्रोम पर IsEnabled="False" और RoundCorners="False" सेट करके या 3.99 की तरह चौड़ाई या ऊंचाई सेट करके और "व्हाइट बॉर्डर" चलाकर इसे सत्यापित कर सकते हैं।

अद्यतन
ButtonChrome की अंदरूनी सीमा आप अपने खुद के ButtonChrome जो इस संपत्ति कहते हैं बना सकते हैं अक्षम करने के लिए। दुर्भाग्यवश बटन क्रॉम को बंद कर दिया गया है ताकि हम इससे प्राप्त नहीं हो सकें। मैंने पूरी कक्षा की प्रतिलिपि बनाने और संपत्ति अक्षम करने योग्य बैंकर जोड़ने की कोशिश की और ऐसा लगता है कि यह काम कर रहा है।आप इसे इस

<local:MyButtonChrome ... 
         DisableInnerBorder="True"> 

यह सिर्फ नियमित ButtonChrome तरह काम करता है उसके अलावा की तरह उपयोग कर सकते हैं और आप भी अन्य गुण आदि है कि आप चाहते हो सकता है जोड़ सकते हैं। इस विधि में कमी हो सकती है जिसे मैंने नहीं सोचा है, लेकिन एक छोटे से परीक्षण के लिए यह ठीक काम करता है।

apperently कोड की 937 लाइनों के लिए इतने पर पोस्ट बहुत ज्यादा था :) मैं यहाँ MyButtonChrome.cs अपलोड किया गया: http://www.mediafire.com/?wnra4qj4qt07wn6

Answer 2

आप ButtonChrome अनुकूलित करने के लिए कोशिश नहीं करनी चाहिए। * क्रोम क्लासेस थीम-विशिष्ट हैं, यानी वे एक विशिष्ट विंडोज थीम के कार्यान्वयन को शामिल करते हैं और आप इसे ओवरराइड नहीं कर सकते हैं। अपने संसाधन शब्दकोश में "माइक्रोसॉफ्ट_विंडोज़_बीम्स" नामस्थान की घोषणा को देखें - इसमें शायद प्रेजेंटेशनफ्रेमवर्क जैसे कुछ शामिल हैं। एरो ...

आपको अपने कस्टम टेम्पलेट्स में क्या करना चाहिए बटन बटन के बजाय सामान्य सीमा का उपयोग करना और ट्रिगर्स को परिभाषित करना होगा जब बटन दबाया जाता है या घुमाया जाता है तो इसकी पृष्ठभूमि बदलें।

<Style x:Key="BaseButtonStyle" 
    TargetType="{x:Type ButtonBase}"> 
<Setter Property="FocusVisualStyle" 
     Value="{StaticResource ButtonFocusVisual}" /> 
<Setter Property="Background" 
     Value="{StaticResource ButtonNormalBackground}" /> 
<Setter Property="BorderBrush" 
     Value="{StaticResource ButtonNormalBorder}" /> 
<Setter Property="BorderThickness" 
     Value="1" /> 
<Setter Property="Foreground" 
     Value="{StaticResource ButtonNormalForeground}" /> 
<Setter Property="HorizontalContentAlignment" 
     Value="Center" /> 
<Setter Property="VerticalContentAlignment" 
     Value="Center" /> 
<Setter Property="Padding" 
     Value="5,2,5,2" /> 
<Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="{x:Type ButtonBase}"> 
      <Border Name="Chrome" 
        Background="{TemplateBinding Background}" 
        BorderBrush="{TemplateBinding BorderBrush}" 
        BorderThickness="{TemplateBinding BorderThickness}" 
        SnapsToDevicePixels="true" 
        CornerRadius="2"> 
       <ContentPresenter Margin="{TemplateBinding Padding}" 
            VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
            RecognizesAccessKey="True" 
            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> 
      </Border> 
      <ControlTemplate.Triggers> 
       <Trigger Property="IsMouseOver" 
         Value="True"> 
        <Setter Property="Background" 
          Value="{StaticResource ButtonHoverBackground}" /> 
        <Setter Property="Foreground" 
          Value="{StaticResource ButtonHoverForeground}" /> 
       </Trigger> 

       <Trigger Property="IsPressed" 
         Value="True"> 
        <Setter Property="Background" 
          Value="{StaticResource ButtonPressedBackground}" /> 
        <Setter Property="Foreground" 
          Value="{StaticResource ButtonPressedForeground}" /> 
       </Trigger> 
       <Trigger Property="ToggleButton.IsChecked" 
         Value="True"> 
        <Setter Property="Background" 
          Value="{StaticResource ButtonHoverBackground}" /> 
        <Setter Property="Foreground" 
          Value="{StaticResource ButtonNormalForeground}" /> 
       </Trigger> 
       <Trigger Property="IsEnabled" 
         Value="false"> 
        <Setter Property="Foreground" 
          Value="#ADADAD" /> 
       </Trigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
</Setter> 

Answer 3

तुम सिर्फ BorderBrush = पारदर्शी

बदलना होगा अगर आप सिर्फ WhiteBorder से बचना चाहते हैं

<Microsoft_Windows_Themes:ButtonChrome x:Name="Chrome" SnapsToDevicePixels="true" 
         Background="{TemplateBinding Background}" BorderBrush="Transparent" 
         RenderDefaulted="{TemplateBinding IsDefaulted}" RenderMouseOver="{TemplateBinding IsMouseOver}" 
          RenderPressed="{TemplateBinding IsPressed}"> 
          <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" RecognizesAccessKey="True"/> 
         </Microsoft_Windows_Themes:ButtonChrome> 

आप कुछ अन्य बातों के आप अपने खुद के ControlTemplate बनाने के लिए संशोधित करने के लिए चाहते हैं

कृपया इस लिंक

http://mark-dot-net.blogspot.com/2007/07/creating-custom-wpf-button-template-in.html

यहाँ वे अलग बटन टेम्पलेट्स

Answer 4

WPF के महान fetatures में से एक है एक नियंत्रण के व्यवहार का लाभ उठाने के जबकि पूरी तरह से है कि control.You की नज़र गमागमन बस क्रोम पूरी तरह नष्ट कर सकते हैं की क्षमता है और एक कस्टम उपस्थिति बनाएं जो आपकी आवश्यकता से मेल खाती है।

नमूना

<Style x:Key="NoChromeButton" TargetType="{x:Type Button}"> 
     <Setter Property="Background" Value="Transparent"/> 
     <Setter Property="BorderThickness" Value="1"/> 
     <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
     <Setter Property="HorizontalContentAlignment" Value="Center"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Padding" Value="1"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Grid x:Name="Chrome" Background="{TemplateBinding Background}" SnapsToDevicePixels="true"> 
         <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter Property="Foreground" Value="#ADADAD"/> 
          <Setter Property="Opacity" TargetName="Chrome" Value="0.5"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

चेक यह भी http://www.designerwpf.com/2008/03/27/wpf-designers-guide-to-styles-and-templates/

यह कड़ी अब काम करने के लिए लगता है: http://www.designersilverlight.com/2008/03/27/wpf-designers-guide-to-styles-and-templates/

Answer 5

Asfter थोड़ी देर के लिए Meleak के साथ चर्चा कर, अंत में मैं अंतिम समाधान मिल गया मेरे प्रश्न के लिए! धन्यवाद मीलेक!

आप solution source codes here डाउनलोड कर सकते हैं।

Answer 6

मुझे एहसास है कि यह एक पुराना धागा है, लेकिन मुझे यह पता चला जब मैं वही काम करने की कोशिश कर रहा था और मुझे कोई अच्छा समाधान नहीं मिला। मैंने सोचा कि अगर मैं किसी और की मदद करता हूं तो मैं जो पोस्ट करता हूं उसे पोस्ट करता हूं।

जो मैं चाहता था वह फ्लैट बटन था जो सामान्य क्रोम का उपयोग करते समय इस्तेमाल किया जाता था। ऐसा करने का सबसे अच्छा तरीका यह था कि दो पंक्तियों के साथ ग्रिड के अंदर दो सामग्री प्रस्तुतकर्ताओं को धोखा देना और उपयोग करना था। एक सामग्री प्रस्तुतकर्ता सामान्य बटन क्रोम के अंदर है और एक सीमा के अंदर है। एक समय में केवल एक ग्रिड पंक्ति दिखाई जाती है और IsMouseOver ट्रिगर में सेटटर निर्धारित करता है कि कौन सा दिखाया गया है।

<Window.Resources> 
    <Style x:Key="ButtonFocusVisual"> 
     <Setter Property="Control.Template"> 
      <Setter.Value> 
       <ControlTemplate> 
        <Rectangle StrokeDashArray="1 2" StrokeThickness="1" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" SnapsToDevicePixels="true" Margin="2"/> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
    <LinearGradientBrush x:Key="ButtonNormalBackground" EndPoint="0,1" StartPoint="0,0"> 
     <GradientStop Color="#F3F3F3" Offset="0"/> 
     <GradientStop Color="#EBEBEB" Offset="0.5"/> 
     <GradientStop Color="#DDDDDD" Offset="0.5"/> 
     <GradientStop Color="#CDCDCD" Offset="1"/> 
    </LinearGradientBrush> 
    <SolidColorBrush x:Key="ButtonNormalBorder" Color="Transparent"/> 
    <Style x:Key="ActionButtonStyle" TargetType="{x:Type Button}"> 
     <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}"/> 
     <Setter Property="Background" Value="{x:Null}"/> 
     <Setter Property="BorderBrush" Value="{x:Null}"/> 
     <Setter Property="BorderThickness" Value="0"/> 
     <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
     <Setter Property="HorizontalContentAlignment" Value="Center"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Padding" Value="1"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Grid> 
         <Grid.RowDefinitions> 
          <RowDefinition x:Name="ContentWithChrome" Height="0"></RowDefinition> 
          <RowDefinition x:Name="ContentWithBorder" Height="Auto"></RowDefinition> 
         </Grid.RowDefinitions> 
         <Themes:ButtonChrome Grid.Row="0" x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}" RenderDefaulted="{TemplateBinding IsDefaulted}" SnapsToDevicePixels="true"> 
          <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
         </Themes:ButtonChrome> 
         <Border Grid.Row="1" Margin="0,2,0,2"> 
          <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
         </Border> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsMouseOver" Value="True"> 
          <Setter Property="Height" TargetName="ContentWithChrome" Value="Auto" /> 
          <Setter Property="Height" TargetName="ContentWithBorder" Value="0" /> 
         </Trigger> 
         <Trigger Property="IsKeyboardFocused" Value="true"> 
          <Setter Property="RenderDefaulted" TargetName="Chrome" Value="true"/> 
         </Trigger> 
         <Trigger Property="ToggleButton.IsChecked" Value="true"> 
          <Setter Property="RenderPressed" TargetName="Chrome" Value="true"/> 
         </Trigger> 
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter Property="Foreground" Value="#ADADAD"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Window.Resources> 

Answer 7

एक विकल्प अन्य लाइब्रेरी जैसे टेलरिक या xceed (मुफ्त वाणिज्यिक उपयोग के लिए भी उपलब्ध) का उपयोग करने का विकल्प भी है। मेरे समाधान में मैंने Xceed.Wpf.Toolkit.Chromes.ButtonChrome (माइक्रोसॉफ्ट बटन क्रॉम को सील कर दिया गया है) से प्राप्त एक वर्ग बनाया है। मेरे संसाधन डिक्शनरी में मैंने कम्बोबॉक्स के लिए एक शैली लागू की, जिसे वीएनएस के लिए ब्लेंड द्वारा बनाया गया। ToggleButton मैं कोड निम्नलिखित को लागू किया है के लिए ControlTemplate में:

<ControlTemplate TargetType="{x:Type ToggleButton}"> 
    <p:ButtonChromeManaged x:Name="Chrome" 
          Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" 
          Background="Transparent" 
          BorderBrush="Transparent" 
          CornerRadius="0" 
          SnapsToDevicePixels="true"> 
     <p:ButtonChromeManaged.Template> 
      <ControlTemplate TargetType="{x:Type p:ButtonChromeManaged}"> 
       <Border Background="Red"> 
        <Path x:Name="Arrow" 
          Margin="0,1,0,0" 
          HorizontalAlignment="Center" 
          VerticalAlignment="Center" 
          Data="{StaticResource DownArrowGeometry}" 
          Fill="Black" /> 
       </Border> 
      </ControlTemplate> 
     </p:ButtonChromeManaged.Template> 

यहाँ आप केवल सबसे impertand stuf देख सकते हैं। आपका डाउनएरो जीमेट्री और इसी तरह, आपको करना है। मुझे उम्मीद है कि यह किसी की मदद कर सकता है ;-)