🕛 ⚠️ ✡️ विंडोज 8 अनुप्रयोगों में टेक्स्टबॉक्स के लिए वॉटरमार्क 👨‍🍳 🖖 📤

हाल ही में, यह टेक्स्टबॉक्स के लिए एक व्याख्यात्मक शिलालेख के अलावा, फैशनेबल भी हो गया है, और टेक्स्टबॉक्स पर कुछ मदद भी लिखने के लिए। यह सब ध्यान आकर्षित करने के लिए तस्वीर की तरह दिखना चाहिए। जबकि उपयोगकर्ता ने कुछ भी दर्ज नहीं किया है, एक संकेत पर प्रकाश डाला गया है। यदि उपयोगकर्ता ने पाठ दर्ज किया है, तो टूलटिप प्रदर्शित नहीं होता है। भगवान जानता है कि एक जटिल तर्क क्या है, लेकिन क्योंकि ट्रिगर्स को Windows स्टोर अनुप्रयोगों में ControlTemplate से दूर ले जाया गया था, आपको यह स्टाइल के साथ नहीं, बल्कि एक नए नियंत्रण के साथ करना होगा।
कटौती के तहत, हम आपको ऐसे घटक के विकास के माध्यम से चलेंगे, जो उन लोगों पर केंद्रित हैं जो पहली बार अपने नियंत्रण के विकास के करीब पहुंच रहे हैं। जो लोग पहले से ही विंडोज स्टोर के लिए प्रोग्राम करते हैं, उनके लिए कोई रहस्योद्घाटन नहीं होगा, लेकिन अगर यह मुश्किल नहीं है, तो टिप्पणियों में सिफारिशें पोस्ट करें, हो सकता है कि कोई व्यक्ति वास्तव में इस तरह के कार्य के लिए एक अच्छा नियंत्रण बनाने का फैसला करता है।

चलो चलते हैं।
हम एक नया विंडोज स्टोर एप्लिकेशन बनाते हैं। समाधान में एक नई असेंबली जोड़ें (संदर्भ मेनू में समाधान पर राइट-क्लिक करें -> नई परियोजना जोड़ें):

इस असेंबली में एक नया तत्व जोड़ें (प्रोजेक्ट पर राइट-क्लिक करें, -> नया आइटम):

हमारे नियंत्रण की सीएस फ़ाइल में, हम पूर्वजों को टेक्स्टबॉक्स में बदलते हैं:

public sealed partial class WaterMarkedTextBox : TextBox

इसके अलावा, हमें आधार घटक की जगह और सामग्री को हटाकर मार्कअप को बदलना होगा:

इन सरल क्रियाओं ने हमें अपने घटक में उन सभी क्षेत्रों और विधियों को प्राप्त करने की अनुमति दी, जिनके आधार में TextBox था। केवल एक चीज जो हमें शोभा नहीं देती है वह है हिंट शो करने की टेक्स्टबॉक्स की क्षमता की कमी। हम अपने वंशज टेक्स्टबॉक्स के टेम्पलेट को फिर से परिभाषित करते हैं, एक संकेत प्रदर्शित करने के लिए इसमें एक टेक्स्टब्लॉक जोड़ते हैं:

 <TextBox.Template> <ControlTemplate TargetType="TextBox"> <Grid> <TextBox Text="{Binding Text, RelativeSource={RelativeSource TemplatedParent},Mode=TwoWay}" /> <TextBlock Text="{Binding WaterMark, RelativeSource={RelativeSource TemplatedParent}}" Foreground="Gray" Margin="5,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Center" Visibility="Collapsed" IsHitTestVisible="False"/> </Grid> </ControlTemplate> </TextBox.Template>

क्योंकि आप कंस्ट्रक्टर में दृश्य घटकों के साथ काम नहीं कर सकते हैं, हम घटक लोडिंग ईवेंट की सदस्यता लेंगे और हम इस ईवेंट के हैंडलर में सभी उपयोगी कार्य करेंगे:

 public WaterMarkedTextBox() { this.InitializeComponent(); Loaded += WaterMarkedTextBox_Loaded; }

यह निर्धारित करने के लिए कि हमारे पास तत्व पर ध्यान केंद्रित है या नहीं, एक फ़ील्ड जोड़ें:

 private bool _isFocused;

ठीक है, हमें संकेत पाठ को संग्रहीत करने के लिए DependencyProperty की आवश्यकता है:

 /// <summary> ///    /// </summary> public string WaterMark { get { return (string)GetValue(WaterMarkProperty); } set { SetValue(WaterMarkProperty, value); } } /// <summary> /// Static part of dependency property WaterMark /// </summary> public static readonly DependencyProperty WaterMarkProperty = DependencyProperty.Register("WaterMark", typeof(string), typeof(WaterMarkedTextBox), new PropertyMetadata(""));

यही है, घटक को लोड करने की प्रक्रिया लिखना, इनपुट फ़ोकस प्राप्त करना और उसे खोना:

 void WaterMarkedTextBox_Loaded(object sender, RoutedEventArgs e) { var grid = (Grid)VisualTreeHelper.GetChild(this, 0); TextBox innerTextBox = (TextBox)grid.Children[0]; innerTextBox.GotFocus += WaterMarkedTextBox_GotFocus; innerTextBox.LostFocus += WaterMarkedTextBox_LostFocus; ChangeWatermarkTextVisibility(); } void WaterMarkedTextBox_LostFocus(object sender, RoutedEventArgs e) { _isFocused = false; ChangeWatermarkTextVisibility(); } void WaterMarkedTextBox_GotFocus(object sender, RoutedEventArgs e) { _isFocused = true; ChangeWatermarkTextVisibility(); }

ठीक है, एक संकेत की दृश्यता को बदलने के लिए सबसे हालिया तरीका:

 private void ChangeWatermarkTextVisibility() { var grid = (Grid)VisualTreeHelper.GetChild(this, 0); TextBlock watermarkText = (TextBlock)grid.Children[1]; if (!string.IsNullOrEmpty(Text) || _isFocused) { watermarkText.Visibility = Visibility.Collapsed; } else { watermarkText.Visibility = Visibility.Visible; } }

घोल को एक साथ मिलाकर।
क्योंकि मैंने प्रारंभिक परियोजना के रूप में ब्लैंक ऐप को लिया, फिर मैंने मुख्य रूप में निम्नलिखित मार्कअप में प्रवेश किया:

 <Page x:Class="App11.MainPage" xmlns:MyControls="using:MyControls" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:App11" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <StackPanel Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> <TextBlock Text=" :" /> <MyControls:WaterMarkedTextBox WaterMark="     Enter" /> </StackPanel> </Page>

नेमस्पेस कनेक्ट करने के बारे में नहीं सोचने के लिए, मैं आमतौर पर टूल पैनल से फॉर्म पर नए घटकों को खींचता हूं:

खैर, यह सब कैसे दिखता है, आप इस पोस्ट की पहली तस्वीर में देख सकते हैं, अच्छी तरह से, या मेरे कार्यों को दोहराकर और एप्लिकेशन लॉन्च करके।

विंडोज 8 अनुप्रयोगों में टेक्स्टबॉक्स के लिए वॉटरमार्क

More articles: