WPF editable textblock itemscontrol MVVM

Question

I have an itemscontrol with repeating stackpanels with child controls. Each stackpanel contains a textblock I wish to be editable. The project has a MVVM framework implemented what makes this a difficult one. I think the best way is to make a button inside each stackpanel that is connected to a BooleanToVisibilityConverter. This converter is connected to a textblock and inverted to a textbox. So it shows one of the two. The problem is I am having trouble realizing this solution.

If i bind the visibility to the back-end then this will result in showing all the textblocks or non. The solution i have now is as following:

<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
    <CheckBox x:Name="DisplayBox" IsChecked="False"/>
        <TextBlock Visibility="{Binding ElementName=DisplayBox,
                                        Path=IsChecked, 
                                        Converter={StaticResource BoolToVis}}">
             <Run Text="{Binding Title}"/>
        </TextBlock>
</StackPanel>

So my question is: Is there a simple way to implement an editable textblock with only XAML binded to each control? Or do I need to implement a way that connects it to the back-end.

Why don't you use a TextBox instead, then switch editing feature on/off by the IsReadOnly property? That's not exactly the same as the TextBlock, but it is very easy. Changing kind of control (i.e. TextBlock for view and TextBox for editing) is not a trivial task: it's doable, but not as easy as using the same control. — Mario Vernari
haha that's exactly what i was trying now! I have something like this: ` <CheckBox x:Name="DisplayBox" IsChecked="False"/> <TextBox Foreground="Black" FontWeight="SemiBold" FontSize="14" Background="Transparent" BorderThickness="0" IsReadOnly="{Binding ElementName=DisplayBox, Path=IsChecked}" Text="{Binding Title}"> </TextBox>` Now i need to figure out how to change the style of the textbox related to a boolean and also change the checkbox to a button — RolandMakkelie
@RolandMakkelie what's exactly the problem? How to put 2 controls that that are visible depending on CheckBox? — dkozl
I am trying to make a textblock, or textbox that looks like a textblock, and make it with one click an editable textbox. The changed value is binded automatically to a property changed list — RolandMakkelie
@RolandMakkelie do you still need solution or you're happy with read-only TextBox? — dkozl

ΩmegaMan ΩmegaMan · Accepted Answer · 2015-04-30T14:42:42

this will result in showing all the textblocks

Using the name of a control to bind to it is a strategy I use quite often, but this time it has let you down for you are in a repeating template. For using that binding process in a template makes the selection becomes global and not local.

So one strategy is to use a RelativeSource binding and point to the local parent (the checkbox) such as:

<CheckBox IsChecked="False">
    <TextBlock Visibility="{Binding IsChecked, 
                                    Converter={StaticResource BoolToVis},
                                    RelativeSource={RelativeSource Mode=FindAncestor, 
                                                     AncestorType={x:Type CheckBox}
                                                   }
                            }">
        <Run Text="{Binding Title}" />
    </TextBlock>
</CheckBox>

As an aside and don't read this the wrong way,

project has a MVVM framework implemented what makes this a difficult one.

MVVM is simply a way to separate code concerns (operations, classes and GUI) and frankly shouldn't necessarily come into play when dealing with Xaml bindings.

Whether the data resides on a VM or the page is immaterial for what is required is to set the page's datacontext or the control's datacontext with a valid class instance to be reflected by the binding system. Nothing more nothing less.

For new programmers there are a lot of concepts such as MVVM and binding and that learning curve is significant. My advice is that the buzzword used to be Three tiered systems..now its MVVM or MVC but in the end they all do much of the same, just separation of those programming concerns.

WPF editable textblock itemscontrol MVVM

1 Answers