উদাহরণস্বরূপ, পাঠ্যবক্সটি ফাঁকা থাকলে অনুসন্ধানের পাঠ্য বাক্সে ফেসবুকের একটি "অনুসন্ধান" ইঙ্গিত পাঠ্য থাকে।
কীভাবে ডাব্লুপিএফ পাঠ্য বাক্স দিয়ে এটি অর্জন করবেন ??
উদাহরণস্বরূপ, পাঠ্যবক্সটি ফাঁকা থাকলে অনুসন্ধানের পাঠ্য বাক্সে ফেসবুকের একটি "অনুসন্ধান" ইঙ্গিত পাঠ্য থাকে।
কীভাবে ডাব্লুপিএফ পাঠ্য বাক্স দিয়ে এটি অর্জন করবেন ??
উত্তর:
আপনি VisualBrush
এবং এটির মধ্যে কিছু ট্রিগার দিয়ে আরও সহজেই এটি সম্পাদন করতে পারেন Style
:
<TextBox>
<TextBox.Style>
<Style TargetType="TextBox" xmlns:sys="clr-namespace:System;assembly=mscorlib">
<Style.Resources>
<VisualBrush x:Key="CueBannerBrush" AlignmentX="Left" AlignmentY="Center" Stretch="None">
<VisualBrush.Visual>
<Label Content="Search" Foreground="LightGray" />
</VisualBrush.Visual>
</VisualBrush>
</Style.Resources>
<Style.Triggers>
<Trigger Property="Text" Value="{x:Static sys:String.Empty}">
<Setter Property="Background" Value="{StaticResource CueBannerBrush}" />
</Trigger>
<Trigger Property="Text" Value="{x:Null}">
<Setter Property="Background" Value="{StaticResource CueBannerBrush}" />
</Trigger>
<Trigger Property="IsKeyboardFocused" Value="True">
<Setter Property="Background" Value="White" />
</Trigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
এর পুনঃব্যবহারযোগ্যতা বাড়াতে Style
, আপনি আসল কিউ ব্যানার পাঠ্য, রঙ, ওরিয়েন্টেশন ইত্যাদি নিয়ন্ত্রণ করতে সংযুক্ত বৈশিষ্ট্যের একটি সেটও তৈরি করতে পারেন
এটি আমার সহজ সমাধান, মাইক্রোসফ্ট থেকে গৃহীত ( https://code.msdn.microsoft.com/windowsapps/How-to-add-a-hint-text-to-ed66a3c6 )
<Grid Background="White" HorizontalAlignment="Right" VerticalAlignment="Top" >
<!-- overlay with hint text -->
<TextBlock Margin="5,2" MinWidth="50" Text="Suche..."
Foreground="LightSteelBlue" Visibility="{Binding ElementName=txtSearchBox, Path=Text.IsEmpty, Converter={StaticResource MyBoolToVisibilityConverter}}" />
<!-- enter term here -->
<TextBox MinWidth="50" Name="txtSearchBox" Background="Transparent" />
</Grid>
IsHitTestVisible="False"
ম্যাটেরিয়াল ডিজাইন হিন্টঅ্যাসিস্ট ব্যবহার সম্পর্কে কী ? আমি এটি ব্যবহার করছি যা আপনি ভাসমান ইঙ্গিতটিও যুক্ত করতে পারেন:
<TextBox Width="150" Height="40" Text="hello" materialDesign:HintAssist.Hint="address" materialDesign:HintAssist.IsFloating="True"></TextBox>
আমি নুগেট প্যাকেজ সহ মেটালিয়াল ডিজাইন ইনস্টল করেছি ডকুমেন্টেশন লিঙ্কে ইনস্টলেশন গাইড রয়েছে
প্রাথমিকভাবে পাঠ্য রঙটি ধূসরতে সেট করে এবং কীবোর্ড ফোকাস অর্জন এবং হারাতে ইভেন্ট হ্যান্ডলার যুক্ত করে কোড-পিছনে এটি করুন।
TextBox tb = new TextBox();
tb.Foreground = Brushes.Gray;
tb.Text = "Text";
tb.GotKeyboardFocus += new KeyboardFocusChangedEventHandler(tb_GotKeyboardFocus);
tb.LostKeyboardFocus += new KeyboardFocusChangedEventHandler(tb_LostKeyboardFocus);
তারপরে ইভেন্ট হ্যান্ডলারগুলি:
private void tb_GotKeyboardFocus(object sender, KeyboardFocusChangedEventArgs e)
{
if(sender is TextBox)
{
//If nothing has been entered yet.
if(((TextBox)sender).Foreground == Brushes.Gray)
{
((TextBox)sender).Text = "";
((TextBox)sender).Foreground = Brushes.Black;
}
}
}
private void tb_LostKeyboardFocus(object sender, KeyboardFocusChangedEventArgs e)
{
//Make sure sender is the correct Control.
if(sender is TextBox)
{
//If nothing was entered, reset default text.
if(((TextBox)sender).Text.Trim().Equals(""))
{
((TextBox)sender).Foreground = Brushes.Gray;
((TextBox)sender).Text = "Text";
}
}
}
পাঠ্যবক্সটি উত্তরাধিকার সূত্রে আপনাকে একটি কাস্টম নিয়ন্ত্রণ তৈরি করতে হবে। অনুসন্ধানের পাঠ্যবক্সের নমুনা সম্পর্কে নীচের লিঙ্কটিতে একটি দুর্দান্ত উদাহরণ রয়েছে। দয়া করে এটি দেখুন
http://davidowens.wordpress.com/2009/02/18/wpf-search-text-box/
আপনি খুব সহজ উপায়ে করতে পারেন। আপনার পাঠ্যবক্সের মতো একই জায়গায় একটি লেবেল রাখার ধারণা। যদি পাঠ্যবক্সে কোনও পাঠ্য না থাকে এবং মনোযোগ না দেয় তবে আপনার লেবেলটি দৃশ্যমান হবে।
<Label Name="PalceHolder" HorizontalAlignment="Left" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Height="40" VerticalAlignment="Top" Width="239" FontStyle="Italic" Foreground="BurlyWood">PlaceHolder Text Here
<Label.Style>
<Style TargetType="{x:Type Label}">
<Setter Property="Visibility" Value="Hidden"/>
<Style.Triggers>
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding ="{Binding ElementName=PalceHolder, Path=Text.Length}" Value="0"/>
<Condition Binding ="{Binding ElementName=PalceHolder, Path=IsFocused}" Value="False"/>
</MultiDataTrigger.Conditions>
<Setter Property="Visibility" Value="Visible"/>
</MultiDataTrigger>
</Style.Triggers>
</Style>
</Label.Style>
</Label>
<TextBox Background="Transparent" Name="TextBox1" HorizontalAlignment="Left" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Height="40"TextWrapping="Wrap" Text="{Binding InputText,Mode=TwoWay}" VerticalAlignment="Top" Width="239" />
বোনাস: আপনি যদি আপনার পাঠ্যবক্সের জন্য ডিফল্ট মান রাখতে চান তবে ডেটা জমা দেওয়ার সময় এটি সেট করার পরে নিশ্চিত হন (উদাহরণস্বরূপ: "ইনপুটটেক্সট" = "প্লেসহোল্ডার পাঠ্য এখানে" খালি থাকলে)।
অন্য পদ্ধতির ;-)
এই সঙ্গে কাজ করে PasswordBox
। আপনার সাথে ব্যবহার করতে চান তাহলে TextBox
, সহজভাবে বিনিময় PasswordChanged
সঙ্গে TextChanged
।
XAML:
<Grid>
<!-- overlay with hint text -->
<TextBlock Margin="5,2"
Text="Password"
Foreground="Gray"
Name="txtHintPassword"/>
<!-- enter user here -->
<PasswordBox Name="txtPassword"
Background="Transparent"
PasswordChanged="txtPassword_PasswordChanged"/>
</Grid>
CodeBehind:
private void txtPassword_PasswordChanged(object sender, RoutedEventArgs e)
{
txtHintPassword.Visibility = Visibility.Visible;
if (txtPassword.Password.Length > 0)
{
txtHintPassword.Visibility = Visibility.Hidden;
}
}
আমি একবার একই পরিস্থিতিতে পড়েছিলাম, আমি এটি নিম্নলিখিতভাবে সমাধান করেছি। আমি কেবল একটি ইঙ্গিত বাক্সের প্রয়োজনীয়তাগুলিই পূরণ করেছি, আপনি অন্যান্য ইভেন্টের উপর ফোকাস ইত্যাদির উপর প্রভাব এবং অন্যান্য জিনিস যুক্ত করে এটিকে আরও ইন্টারেক্টিভ করতে পারেন you
ডাব্লুপিএফ কোড (এটিকে পাঠযোগ্য করে তোলার জন্য স্টাইলিং সরিয়ে ফেলেছি)
<Grid Margin="0,0,0,0" Background="White">
<Label Name="adminEmailHint" Foreground="LightGray" Padding="6" FontSize="14">Admin Email</Label>
<TextBox Padding="4,7,4,8" Background="Transparent" TextChanged="adminEmail_TextChanged" Height="31" x:Name="adminEmail" Width="180" />
</Grid>
<Grid Margin="10,0,10,0" Background="White" >
<Label Name="adminPasswordHint" Foreground="LightGray" Padding="6" FontSize="14">Admin Password</Label>
<PasswordBox Padding="4,6,4,8" Background="Transparent" PasswordChanged="adminPassword_PasswordChanged" Height="31" x:Name="adminPassword" VerticalContentAlignment="Center" VerticalAlignment="Center" Width="180" FontFamily="Helvetica" FontWeight="Light" FontSize="14" Controls:TextBoxHelper.Watermark="Admin Password" FontStyle="Normal" />
</Grid>
সি # কোড
private void adminEmail_TextChanged(object sender, TextChangedEventArgs e)
{
if(adminEmail.Text.Length == 0)
{
adminEmailHint.Visibility = Visibility.Visible;
}
else
{
adminEmailHint.Visibility = Visibility.Hidden;
}
}
private void adminPassword_PasswordChanged(object sender, RoutedEventArgs e)
{
if (adminPassword.Password.Length == 0)
{
adminPasswordHint.Visibility = Visibility.Visible;
}
else
{
adminPasswordHint.Visibility = Visibility.Hidden;
}
}
আরেকটি সমাধান হ'ল মাহপ্যাপস.মেট্রোর মতো ডাব্লুপিএফ টুলকিট ব্যবহার করা। এটিতে অনেকগুলি দুর্দান্ত বৈশিষ্ট্য রয়েছে যেমন একটি পাঠ্য বাক্স ওয়াটারমার্ক:
Controls:TextBoxHelper.Watermark="Search..."
আমি পেয়েছি এবং হারিয়ে ফোকাস ইভেন্টগুলি ব্যবহার করেছি:
Private Sub txtSearchBox_GotFocus(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles txtSearchBox.GotFocus
If txtSearchBox.Text = "Search" Then
txtSearchBox.Text = ""
Else
End If
End Sub
Private Sub txtSearchBox_LostFocus(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles txtSearchBox.LostFocus
If txtSearchBox.Text = "" Then
txtSearchBox.Text = "Search"
Else
End If
End Sub
এটি ভাল কাজ করে তবে পাঠ্যটি ধূসর। পরিষ্কার করা প্রয়োজন। আমি ভিবি.এনইটি ব্যবহার করছিলাম
<Grid>
<TextBox Name="myTextBox"/>
<TextBlock>
<TextBlock.Style>
<Style TargetType="TextBlock">
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=myTextBox, Path=Text.IsEmpty}" Value="True">
<Setter Property="Text" Value="Prompt..."/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
</Grid>
এটি আমার গ্রহণ:
<ControlTemplate>
<Grid>
<Grid.Resources>
<!--Define look / layout for both TextBoxes here. I applied custom Padding and BorderThickness for my application-->
<Style TargetType="TextBox">
<Setter Property="Padding" Value="4"/>
<Setter Property="BorderThickness" Value="2"/>
</Style>
</Grid.Resources>
<TextBox x:Name="TbSearch"/>
<TextBox x:Name="TbHint" Text="Suche" Foreground="LightGray"
Visibility="Hidden" IsHitTestVisible="False" Focusable="False"/>
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition SourceName="TbSearch" Property="Text" Value="{x:Static sys:String.Empty}"/>
<Condition SourceName="TbSearch" Property="IsKeyboardFocused" Value="False"/>
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter TargetName="TbHint" Property="Visibility" Value="Visible"/>
</MultiTrigger.Setters>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition SourceName="TbSearch" Property="Text" Value="{x:Null}"/>
<Condition SourceName="TbSearch" Property="IsKeyboardFocused" Value="False"/>
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter TargetName="TbHint" Property="Visibility" Value="Visible"/>
</MultiTrigger.Setters>
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
শীর্ষ এক সহ বেশিরভাগ উত্তরগুলির মধ্যে আমার মতে ত্রুটি রয়েছে।
এই সমাধানটি সমস্ত পরিস্থিতিতে কাজ করে। খাঁটি এক্সএএমএল, সহজেই পুনরায় ব্যবহারযোগ্য।
আমি সঙ্গে এই কাজ করা সম্ভব VisualBrush
এবং একটি মধ্যে কিছু ট্রিগার Style
দ্বারা প্রস্তাবিত: sellmeadog
।
<TextBox>
<TextBox.Style>
<Style TargetType="TextBox" xmlns:sys="clr-namespace:System;assembly=mscorlib">
<Style.Resources>
<VisualBrush x:Key="CueBannerBrush" AlignmentX="Left" AlignmentY="Center" Stretch="None">
<VisualBrush.Visual>
<Label Content="Search" Foreground="LightGray" />
</VisualBrush.Visual>
</VisualBrush>
</Style.Resources>
<Style.Triggers>
<Trigger Property="Text" Value="{x:Static sys:String.Empty}">
<Setter Property="Background" Value="{StaticResource CueBannerBrush}" />
</Trigger>
<Trigger Property="Text" Value="{x:Null}">
<Setter Property="Background" Value="{StaticResource CueBannerBrush}" />
</Trigger>
<Trigger Property="IsKeyboardFocused" Value="True">
<Setter Property="Background" Value="White" />
</Trigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
@ সেলম্যাডোগ: অ্যাপ্লিকেশন চলছে, বিটি ডিজাইন লোড হচ্ছে না ... নিম্নলিখিত ত্রুটিটি আসে: দ্ব্যর্থক ধরণের রেফারেন্স। 'স্ট্যাটিক এক্সটেনশন' নামের একটি প্রকার কমপক্ষে দুটি নেমস্পেসে দেখা যায়, 'এমএস.ইন্টার্নাল.মেটাডাটা. এক্সপোজড টাইপস এক্সএএমএল' এবং 'সিস্টেম. উইন্ডোজ.মার্কআপ'। অ্যাসেম্বলি এক্সএমএলএসডিফিনিশন বৈশিষ্ট্যগুলি সমন্বিত করার বিষয়ে বিবেচনা করুন। নেট। 3.5 ব্যবহার করছি
<Trigger Property="Text" Value="{x:Static sys:String.Empty}">
হয়ে সমস্যার সমাধান করেছেন<Trigger Property="Text" Value="">
ডাব্লুপিএফের জন্য, কোনও উপায় নেই। আপনি এটি নকল করতে হবে। এই উদাহরণটি দেখুন । একটি মাধ্যমিক (ফ্লেকি সলিউশন) হ'ল একটি উইনফর্মস ব্যবহারকারী নিয়ন্ত্রণ যা টেক্সটবক্স থেকে উত্তরাধিকার সূত্রে প্রাপ্ত হয় এবং সম্পাদনা নিয়ন্ত্রণে EM_SETCUEBANNER বার্তা প্রেরণ করে। অর্থাত।
[DllImport("user32.dll", CharSet = CharSet.Auto)]
private static extern IntPtr SendMessage(IntPtr hWnd, Int32 msg, IntPtr wParam, IntPtr lParam);
private const Int32 ECM_FIRST = 0x1500;
private const Int32 EM_SETCUEBANNER = ECM_FIRST + 1;
private void SetCueText(IntPtr handle, string cueText) {
SendMessage(handle, EM_SETCUEBANNER, IntPtr.Zero, Marshal.StringToBSTR(cueText));
}
public string CueText {
get {
return m_CueText;
}
set {
m_CueText = value;
SetCueText(this.Handle, m_CueText);
}
এছাড়াও, আপনি যদি উইনফর্ম নিয়ন্ত্রণ পদ্ধতির হোস্ট করতে চান তবে আমার একটি কাঠামো আছে যা ইতিমধ্যে বিটফ্লেক্স ফ্রেমওয়ার্ক নামে এই প্রয়োগটি অন্তর্ভুক্ত করে, যা আপনি এখানে নিখরচায় ডাউনলোড করতে পারেন ।
আপনি আরও তথ্য চাইলে এখানে বিটফ্লেক্স সম্পর্কে একটি নিবন্ধ দেওয়া আছে। আপনি সন্ধান করতে পারবেন যে আপনি যদি উইন্ডোজ এক্সপ্লোরার স্টাইল নিয়ন্ত্রণগুলি সন্ধান করেন তবে এটি সাধারণত কখনই বাক্সের বাইরে আসে না এবং ডাব্লুপিএফ হ্যান্ডলগুলির সাথে কাজ করে না বলে আপনি উইন 32 এর চারপাশে একটি সহজ মোড়কে লিখতে পারবেন না বা আপনার মতো কোনও নিয়ন্ত্রণ রাখতে পারবেন না উইনফোর্ডস সহ
স্ক্রীনশট: