दिलचस्प पोस्ट
जावा में C ++ 'दोस्त' अवधारणा को अनुकरण करने का एक तरीका है? jQuery – चेकबॉक्स सक्षम / अक्षम करें jQuery स्क्रोलपॉप () सफारी या क्रोम में काम नहीं करता (विंडोज़) जावा में डाउनकास्टिंग एएसपी.नेट एमवीसी में ड्रॉपडाउन लिस्ट का उपयोग करने के सर्वश्रेष्ठ प्रोग्रामिंग अभ्यास समायोजित करने के बीच अंतर Android में रीज़ेस करें और समायोजित करें? सी # इंटरफेस स्पष्ट कार्यान्वयन बनाम स्पष्ट कार्यान्वयन TypeScript किसी भी बनाम ऑब्जेक्ट सी ++ कोड से यूएमएल उत्पन्न करना? स्प्रिंग डाटा रेस्ट और कॉर्स कैसे bind_result बनाम get_result का उपयोग करने का उदाहरण इकाई फ़्रेमवर्क के साथ कैस्केडिंग हटाना – ईएफ द्वारा हटाए गए संबंधित संस्थाएं ब्राउज़र डेवलपर टूल को अक्षम कैसे करें? एचटीएमएल के चयन पर मापदंडों को कैसे पारित करें कोर – कैसे 'preflight' एक httprequest?

WPF में एक बटन माउसओवर के लिए पृष्ठभूमि कैसे बदलें?

मेरे पास इस पेज के साथ एक बटन है जिसमें एक्सएएमएल:

<Button Content="Button" HorizontalAlignment="Left" VerticalAlignment="Bottom" Width="50" Height="50" HorizontalContentAlignment="Left" BorderBrush="{x:Null}" Foreground="{x:Null}" Margin="50,0,0,0"> <Button.Style> <Style TargetType="Button"> <Setter Property="Background" Value="Green"/> <Style.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Background" Value="Red"/> </Trigger> </Style.Triggers> </Style> </Button.Style> </Button> 

लेकिन जब मैं अपने बटन पर माउस डालता हूं, बटन की पृष्ठभूमि डिफ़ॉल्ट विंडो ग्रे पृष्ठभूमि में बदलती है
समस्या क्या है?

माउसओवर से पहले और बाद में यह बटन चित्र है:
पहले:
से पहले
बाद:
बाद

वेब के समाधान से एकत्रित समाधान "WPF में एक बटन माउसओवर के लिए पृष्ठभूमि कैसे बदलें?"

Button पर डिफ़ॉल्ट MouseOver व्यवहार को हटाने के लिए आपको MouseOver को संशोधित करने की आवश्यकता होगी। निम्नलिखित के लिए अपनी Style परिभाषा बदलने से चाल चलनी चाहिए:

 <Style TargetType="{x:Type Button}"> <Setter Property="Background" Value="Green"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Button}"> <Border Background="{TemplateBinding Background}" BorderBrush="Black" BorderThickness="1"> <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/> </Border> </ControlTemplate> </Setter.Value> </Setter> <Style.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Background" Value="Red"/> </Trigger> </Style.Triggers> </Style> 

संपादित करें: यह कुछ साल देर से है, लेकिन आप वास्तव में उस सीमा के अंदर सीमावर्ती ब्रश सेट कर सकते हैं जो वहां है। आईडीके अगर यह बताया गया था लेकिन यह ऐसा नहीं लगता है …

यह मेरे लिए अच्छी तरह से काम किया

बटन शैली

 <Style x:Key="TransparentStyle" TargetType="{x:Type Button}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Border> <Border.Style> <Style TargetType="{x:Type Border}"> <Style.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Background" Value="DarkGoldenrod"/> </Trigger> </Style.Triggers> </Style> </Border.Style> <Grid Background="Transparent"> <ContentPresenter></ContentPresenter> </Grid> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> 

बटन

 <Button Style="{StaticResource TransparentStyle}" VerticalAlignment="Top" HorizontalAlignment="Right" Width="25" Height="25" Command="{Binding CloseWindow}"> <Button.Content > <Grid Margin="0 0 0 0"> <Path Data="M0,7 L10,17 M0,17 L10,7" Stroke="Blue" StrokeThickness="2" HorizontalAlignment="Center" Stretch="None" /> </Grid> </Button.Content> </Button> 

टिप्पणियाँ

  • बटन एक छोटे से नीले पार दिखाता है, जो किसी विंडो को बंद करने के लिए इस्तेमाल होता है।
  • ग्रिड की पृष्ठभूमि को "पारदर्शी" पर सेट करके, यह सबसे अच्छा जोड़ता है, जिसका मतलब है कि अगर माउस बटन पर कहीं भी है, तो यह काम करेगा। इस टैग को छोड़ दें, और बटन केवल रोशनी देगा अगर माउस आइकन में वेक्टर लाइनों में से एक है (यह बहुत उपयोगी नहीं है)।

बस मेरी बटन शैली को मेरे संसाधन उपकरण से साझा करना चाहते हैं जो मैं उपयोग कर रहा हूं। आप स्टाइल ट्रिगर्स पर आसानी से ऑन-ऑन पृष्ठभूमि को बदल सकते हैं। " रंग एनीमेशन से = आपका वांछित बीजी (यानी # एफएफसीईएफ 7 ए 0)" बटन बीजी स्वचालित रूप से माउसओवर स्थिति के बाद अपने मूल बीजी में लौट जाएगा। आप यह भी निर्धारित कर सकते हैं कि संक्रमण कितनी तेजी से है

संसाधन डिक्शनरी

 <Style x:Key="Flat_Button" TargetType="{x:Type Button}"> <Setter Property="Width" Value="100"/> <Setter Property="Height" Value="50"/> <Setter Property="Margin" Value="2"/> <Setter Property="FontFamily" Value="Arial Narrow"/> <Setter Property="FontSize" Value="12px"/> <Setter Property="FontWeight" Value="Bold"/> <Setter Property="Cursor" Value="Hand"/> <Setter Property="Foreground"> <Setter.Value> <SolidColorBrush Opacity="1" Color="White"/> </Setter.Value> </Setter> <Setter Property="Background" > <Setter.Value> <SolidColorBrush Opacity="1" Color="#28C2FF" /> </Setter.Value> </Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Button}"> <Border x:Name="border" SnapsToDevicePixels="True" BorderThickness="1" Padding="4,2" BorderBrush="Gray" CornerRadius="3" Background="{TemplateBinding Background}"> <Grid> <ContentPresenter Margin="2" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True" /> </Grid> </Border> </ControlTemplate> </Setter.Value> </Setter> <Style.Triggers> <Trigger Property="IsMouseOver" Value="true"> <Trigger.EnterActions> <BeginStoryboard> <Storyboard> <ColorAnimation To="#D2F898" Storyboard.TargetProperty="(Control.Background).(SolidColorBrush.Color)" FillBehavior="HoldEnd" Duration="0:0:0.25" AutoReverse="False" RepeatBehavior="1x"/> </Storyboard> </BeginStoryboard> </Trigger.EnterActions> <Trigger.ExitActions> <BeginStoryboard> <Storyboard> <ColorAnimation Storyboard.TargetProperty="(Control.Background).(SolidColorBrush.Color)" FillBehavior="HoldEnd" Duration="0:0:0.25" AutoReverse="False" RepeatBehavior="1x"/> </Storyboard> </BeginStoryboard> </Trigger.ExitActions> </Trigger> </Style.Triggers> </Style> 

आपको बस इतना करना होगा कि शैली को बुलाओ

उदाहरण कार्यान्वयन

 <Button Style="{StaticResource Flat_Button}" Height="Auto"Width="Auto"> <StackPanel> <TextBlock Text="SAVE" FontFamily="Arial" FontSize="10.667"/> </StackPanel> </Button> 

एक और अधिक कठिन जवाब है जो ControlTemplate का उपयोग करता है और एनीमेशन प्रभाव होता है ( https://docs.microsoft.com/en-us/dotnet/framework/wpf/controls/customizing-the-appearance-of-an-existing- नियंत्रण )

आपके संसाधन शब्दकोश में आपके बटन के लिए इस तरह एक नियंत्रण टेम्पलेट परिभाषित करें:

 <ControlTemplate TargetType="Button" x:Key="testButtonTemplate2"> <Border Name="RootElement"> <Border.Background> <SolidColorBrush x:Name="BorderBrush" Color="Black"/> </Border.Background> <Grid Margin="4" > <Grid.Background> <SolidColorBrush x:Name="ButtonBackground" Color="Aquamarine"/> </Grid.Background> <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="4,5,4,4"/> </Grid> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal"/> <VisualState x:Name="MouseOver"> <Storyboard> <ColorAnimation Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="Color" To="Red"/> </Storyboard> </VisualState> <VisualState x:Name="Pressed"> <Storyboard> <ColorAnimation Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="Color" To="Red"/> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> </Border> </ControlTemplate> 

अपने XAML में आप नीचे दिए गए अपने बटन के लिए ऊपर दिए गए टेम्पलेट का उपयोग कर सकते हैं:

अपने बटन को परिभाषित करें

 <Button Template="{StaticResource testButtonTemplate2}" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White">My button</Button> 

आशा करता हूँ की ये काम करेगा

सभी उत्तर अब तक पूरी तरह से कुछ और के साथ डिफ़ॉल्ट बटन व्यवहार को बदलने में शामिल हैं हालांकि, आईएमएचओ यह समझने में उपयोगी और महत्वपूर्ण है कि XAML तत्व के लिए मौजूदा, डिफ़ॉल्ट टेम्पलेट को संपादित करके, बस उस हिस्से को बदलना संभव है जो आप की देखभाल करते हैं

एक WPF बटन पर होवर प्रभाव से निपटने के मामले में, एक WPF Button तत्व में उपस्थिति में बदलाव Button लिए डिफ़ॉल्ट शैली में एक Trigger कारण होता है, जो कि IsMouseOver संपत्ति पर आधारित है और Background और BorderBrush गुण सेट करता है नियंत्रण टेम्पलेट में शीर्ष-स्तरीय Border तत्व का Button तत्व की पृष्ठभूमि Border तत्व की पृष्ठभूमि के नीचे है, इसलिए Button बदल रहा है। Button.Background संपत्ति मंडराना प्रभाव को देखने से रोकती नहीं है।

कुछ प्रयासों के साथ, आप इस व्यवहार को अपने खुद के सेटर के साथ ओवरराइड कर सकते हैं, लेकिन क्योंकि जिस तत्व को आप प्रभावित करना चाहते हैं वह टेम्पलेट में है और सीधे अपने एक्सएएमएल से नहीं पहुंचा जा सकता है, यह दृष्टिकोण मुश्किल होगा और आईएमएचओ अति जटिल होगा।

एक अन्य विकल्प Background बजाय Button लिए Content रूप में ग्राफिक का उपयोग करना होगा। यदि आपको ग्राफिक पर अतिरिक्त सामग्री की आवश्यकता है, तो आप सामग्री में शीर्ष-स्तरीय ऑब्जेक्ट के रूप में उन्हें एक Grid साथ जोड़ सकते हैं।

हालांकि, यदि आप वाकई होवर प्रभाव को पूरी तरह से अक्षम करना चाहते हैं (केवल इसे छुपाने के बजाय), तो आप Visual Studio XAML डिजाइनर का उपयोग कर सकते हैं:

  1. अपने XAML का संपादन करते समय, "डिज़ाइन" टैब चुनें
  2. "डिज़ाइन" टैब में, वह बटन ढूंढें जिसके लिए आप प्रभाव को अक्षम करना चाहते हैं।
  3. उस बटन को राइट-क्लिक करें, और "टेम्पलेट संपादित करें / एक कॉपी संपादित करें …" चुनें । आप जहां नया टेम्प्लेट संसाधन स्थापित करना चाहते हैं, वहां आपको प्रांप्ट में चुनें। यह कुछ नहीं करने के लिए दिखाई देगा, लेकिन वास्तव में, डिजाइनर ने आपसे कहा था, जहां नए संसाधन जोड़े हैं, और बटन बटन के रूप में उन संसाधनों का उपयोग करने वाली शैली का संदर्भ देने के लिए अपना बटन तत्व बदल दिया है।
  4. अब, आप उस शैली को संपादित कर सकते हैं। सबसे आसान बात हटाना या टिप्पणी-आउट (जैसे Ctrl + E , C ) <Trigger Property="IsMouseOver" Value="true">...</Trigger> तत्व है बेशक, आप उस बिंदु पर इच्छित टेम्पलेट में कोई भी परिवर्तन कर सकते हैं

जब आप कर लेंगे, तो बटन शैली कुछ ऐसा दिखाई देगा:

 <p:Style x:Key="FocusVisual"> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate> <Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/> </ControlTemplate> </Setter.Value> </Setter> </p:Style> <SolidColorBrush x:Key="Button.Static.Background" Color="#FFDDDDDD"/> <SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/> <SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FFBEE6FD"/> <SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FF3C7FB1"/> <SolidColorBrush x:Key="Button.Pressed.Background" Color="#FFC4E5F6"/> <SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/> <SolidColorBrush x:Key="Button.Disabled.Background" Color="#FFF4F4F4"/> <SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/> <SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/> <p:Style x:Key="ButtonStyle1" TargetType="{x:Type Button}"> <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/> <Setter Property="Background" Value="{StaticResource Button.Static.Background}"/> <Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border}"/> <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> <Setter Property="BorderThickness" Value="1"/> <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}"> <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true"> <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> </Border> <ControlTemplate.Triggers> <Trigger Property="IsDefaulted" Value="true"> <Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/> </Trigger> <!--<Trigger Property="IsMouseOver" Value="true"> <Setter Property="Background" TargetName="border" Value="{StaticResource Button.MouseOver.Background}"/> <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border}"/> </Trigger>--> <Trigger Property="IsPressed" Value="true"> <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background}"/> <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border}"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Disabled.Background}"/> <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Disabled.Border}"/> <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground}"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </p:Style> 

(नोट: आप p: को छोड़ सकते हैं p: वास्तविक कोड में XML नामस्थान योग्यता … मैं उन्हें यहां केवल प्रदान करता हूं क्योंकि स्टैक अतिप्रवाह एक्सएमएल कोड फॉर्मेटर <Style/> तत्वों से भ्रमित हो जाता है, जिनके पास XML नामस्थान के साथ पूर्णतः योग्य नाम नहीं है ।)

यदि आप समान शैली को अन्य बटनों पर लागू करना चाहते हैं, तो आप उन्हें राइट-क्लिक कर सकते हैं और "टेम्पलेट संपादित करें / संसाधन लागू करें" चुन सकते हैं और उस शैली का चयन कर सकते हैं जिसे आपने पहले बटन के लिए जोड़ा था। आप उस शैली को सभी बटनों के लिए डिफ़ॉल्ट शैली बना सकते हैं, XAML के तत्वों के लिए डिफ़ॉल्ट शैली को लागू करने के लिए सामान्य तकनीक का उपयोग कर सकते हैं।