0

I have a simple toggle button which works perfectly well . I can click on the toggle button and change the image that it shows . What i now want to do is the same thing from the code behind . Found a link that is similar

EDIT : This is what i want to do

I read up on the following thread that tells exactly what i need to do
WPF ToggleButton.IsChecked binding does not work

Programmatically my code does not seem to have any effect . if i click on the UI it works but i really wanna change state from within the program . The below program is just a prototype .

I cant figure out whats wrong in my XAML or code . Finnally decided to paste all of it as it a test program !

Xaml :

<Window x:Class="ToggleButtonImageChange.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:ToggleButtonImageChange"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>

        <Image Source="secured.jpg"

         x:Key="MyImage1" />

        <Image Source="unsecured.jpg"

         x:Key="MyImage2" />



        <Style TargetType="{x:Type ToggleButton}"

         x:Key="MyToggleButtonStyle">

            <Setter Property="Content"

            Value="{DynamicResource MyImage2}" />

            <Style.Triggers>

                <Trigger Property="IsChecked"

               Value="True">

                    <Setter Property="Content"

                Value="{DynamicResource MyImage2}" />

                </Trigger>

            </Style.Triggers>

        </Style>

    </Window.Resources>

    <Grid>

        <ToggleButton Style="{StaticResource MyToggleButtonStyle}" Name="tgbtn" Margin="0,29,0,139" IsChecked="{Binding Path=isAdmin, Mode=TwoWay}"/>
       
    </Grid>
</Window>

Code behind :

namespace ToggleButtonImageChange
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window,INotifyPropertyChanged
    {
        bool _isAdmin;
        public MainWindow()
        {
            InitializeComponent();

             isAdmin = true;
            OnPropertyChanged("isAdmin");

        }
         public bool isAdmin
        {
            get
            {
                return _isAdmin;
            }

            set
            {
                _isAdmin = value;
                OnPropertyChanged("isAdmin");
            }
        }

        private void OnPropertyChanged(string p)
        {
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs(p));
        }

        public event PropertyChangedEventHandler PropertyChanged;
    
    }

I went into the debugger and saw that even though i set isAdmin to true the button isChecked remains false and hence the incorrect image is displayed . I cant quite understand what wrong did do & how to get the isChecked changed through code .

Community
  • 1
  • 1
rockstar
  • 3,512
  • 6
  • 40
  • 63
  • how are you calling the function with the code that you show at the top of your question? – Kristian K. May 31 '13 at 05:37
  • Your code works perfectly for me! I have another button, in the clickEvent of which I have tgbtn.IsChecked =!tgbtn.IsChecked; . This works fine for me. – Manoj May 31 '13 at 05:59
  • @KristianK. i use it just the way i show it . if(admin) { tgbtn.IsChecked = true;} . By default the button is unchecked . – rockstar May 31 '13 at 06:15
  • @Manoj i dont have a seperate button . I have only ONE toggle button with the name tgbtn . By default the button is unchecked . I want to do the following in code : if(admin) { tgbtn.IsChecked = true;} . When i do this i hope that my button image changes . Were you able to do this ? – rockstar May 31 '13 at 06:17
  • Is the window loaded already? Maybe you need to update the state on the Loaded event? – Nzc May 31 '13 at 07:28
  • Could you please check the Output window for any data binding errors? – Sevenate May 31 '13 at 08:38
  • @sevenate no errors are to be seen . just ruite messages. :-( – rockstar May 31 '13 at 08:43
  • Ok, I guess I have a solution for you. One min. – Sevenate May 31 '13 at 08:49
  • Posted it as an answer, please check if it work for you as well as it work for me. – Sevenate May 31 '13 at 09:08

1 Answers1

1

Try to change the xaml file to this:

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow"
        Height="350" Width="525"
        x:Name="TestWindow">
    <Window.Resources>
        <Image Source="secured.png" x:Key="MyImage1" />
        <Image Source="unsecured.png" x:Key="MyImage2" />
        <Style TargetType="{x:Type ToggleButton}" x:Key="MyToggleButtonStyle">
            <Setter Property="Content" Value="{DynamicResource MyImage2}" />
            <Style.Triggers>
                <Trigger Property="IsChecked" Value="True">
                    <Setter Property="Content" Value="{DynamicResource MyImage1}" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <ToggleButton x:Name="tgbtn"
                      Margin="0,29,0,139" 
                      Style="{StaticResource MyToggleButtonStyle}"
                      IsChecked="{Binding Path=isAdmin, Mode=TwoWay, ElementName=TestWindow}"/>
    </Grid>
</Window>

Notice the default Content value use MyImage2, but the trigger set it to MyImage1 - they just need to be different images.

Also notice the x:Name="TestWindow" that I've add to root window element - it is used later in binding:

{Binding Path=isAdmin, Mode=TwoWay, ElementName=TestWindow}

This is basically all what is required to change to make it work as you expect, I believe.

Also you can leave you constructor in code behind like this, but this is optional changes:

public MainWindow()
{
    InitializeComponent();
    isAdmin = true;
}

Hope that helps.

Sevenate
  • 6,221
  • 3
  • 49
  • 75
  • I cant get it wrking still :-( The default image is MyImage2(unsecured.jpg) . However in the code i set isAdmin to true which should have set IsChecked to true and hence MyImage1 (secured.jpg) should be seen on startup . But when i start i continue to get the unsecured image . If its working for you can you post the .cs as well . Maybe i missed soemthing there . – rockstar May 31 '13 at 09:11
  • Ok, let me check it again. – Sevenate May 31 '13 at 09:14