3

I have a TextBox

<TextBox x:Name="searchTextBox" Width="200" Height="30" HorizontalAlignment="Left"/>

and two Buttons

<Button x:Name="previous" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped" IsEnabled="False"> <Image Source="/Assets/images/left_arrow.png"/> </Button> <Button x:Name="next" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped" IsEnabled="False"> <Image Source="/Assets/images/right_arrow.png"/> </Button>

Is there a simple solution to enable/disable the Buttons trough the TextBox?

Like for example if the TextBox is empty the Buttons are disabled. And if the TextBox is not empty the Buttons are enabled.

Improve this question

4 Answers 4

Reset to default
3

You could apply a text changed event that checks the input every time it changes.

<TextBox x:Name="searchTextBox" Width="200" Height="30" HorizontalAlignment="Left" TextChanged="TextBox_TextChanged" />

If the text is the way you need it, you can turn the button enabled/disabled.

public void TextBox_TextChanged(object sender, TextChangedEventArgs e) { if (searchTextBox.Text == result) next.IsEnabled = false; }

EDIT: Other than code behind like this approach you could learn about the MVVM design pattern. The other answers partly used practices common in MVVM.

There are various good tutorials for this all around the web.

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Usage of event handlers should be discouraged in WPF
I can't comply with that unless the question stated a design pattern like MVVM was used. I would agree with you otherwise as I don't like code behind that much myself. A simple approach was asked and I believe mine was pretty simple.
When you code WPF, MVVM should be the default thought, Particularly styling and UI related stuff should be handled within XAML as long as sustainable. You are answer is perfectly alright, its just about encouraging the right behaviour for new programmers.
This is an ambiguous topic to me. A programmer should always try to keep it simple and try things out for himself. So if something is ugly, but it works, it's fine for the programmer's solution. This is at least a very good way to learn how a program works. I can edit my answer though to do as you say, encourage newer developers to learn a widely accepted design pattern for WPF.
2

How about using binding + converter? I guess this concept is valid for UWP as well.

E.g. you have a view model with property SearchText which is bound to the text in the TextBox. Then you can do the following:

<Window.Resources> <local:StringToBoolConverter x:Key="StringToBoolConverter" /> </Window.Resources>

...

<TextBox x:Name="searchTextBox" Width="200" Height="30" HorizontalAlignment="Left" Text="{Binding SearchText}"/> <Button x:Name="previous" IsEnabled="{Binding SearchText, Converter={StaticResource StringToBoolConverter}}"/>

And the converter code would be quite simple:

public class StringToBoolConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { return !string.IsNullOrEmpty(value?.ToString()); } public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) { throw new NotImplementedException(); } }

Another way to go is using Command pattern for the buttons. The ICommand interface has CanExecute method that will cantually disable or enable your buttons depending on the return value. See examples in the internet or here.

Improve this answer

Comments

1

Use binding for IsEnabled.

<Button x:Name="previous" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped" IsEnabled="{Binding ElementName=searchTextBox, Path=Text.Length, Mode=OneWay}"></Button>

You can also use Data Triggers but the above is simplest. Converters are not required.

Improve this answer

Comments

0

I use converters in Xamarin Forms (XAML) to achieve this, which should be the same/similar for your scenario. Usually a combination of IsEnabled and Opacity because I like to make more transparent a disabled button.

For example you can create two converters that will interpret a string (the text in the entry field).

The first converter will determine whether the text is empty or not, returning true when there is text.

public class StringToBoolConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { return !string.IsNullOrEmpty(value?.ToString()); } public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) { throw new NotImplementedException(); } }

The second converter will determine the opacity level, returning 100% (e.g: 1.0) when there is text, and 0.3 when the field is empty.

public class StringToFloatConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { return !string.IsNullOrEmpty(value?.ToString())? 1.0 : 0.3; } public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) { throw new NotImplementedException(); } }

Now I tag both converters with a more meaningful name in App.xaml as follows:

<?xml version="1.0" encoding="utf-8" ?> <Application xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:d="http://xamarin.com/schemas/2014/forms/design" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:converters="clr-namespace:Sasw.EasyQr.Converters;assembly=Sasw.EasyQr" mc:Ignorable="d" x:Class="Sasw.EasyQr.App"> <Application.Resources> <ResourceDictionary> <converters:StringToBoolConverter x:Key="EnabledWhenFilledConverter"></converters:StringToBoolConverter> <converters:StringToFloatConverter x:Key="OpaqueWhenFilledConverter"></converters:StringToFloatConverter> </ResourceDictionary> </Application.Resources> </Application>

and now I can refer to these converters from any button control, for example:

<Entry Text = "{Binding Text}" Placeholder="{x:Static resources:AppResources.PlaceholderEnterText}" HorizontalOptions="FillAndExpand" VerticalTextAlignment="Center" VerticalOptions="End"></Entry> <ImageButton Command="{Binding TapClear}" IsEnabled="{Binding Text, Converter={StaticResource EnabledWhenFilledConverter}}" Source ="backspace.png" WidthRequest="30" Opacity="{Binding Text, Converter={StaticResource OpaqueWhenFilledConverter}}" BackgroundColor="Transparent" HorizontalOptions="End" VerticalOptions="CenterAndExpand"></ImageButton>

and see how the button is automatically enabled and made opaque as soon as text is entered in the Entry, and disabled and made transparent when text is deleted.

button transparent and disabled

button enabled and opaque

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.