I'm using ICSharpCode's AvalonEdit text editor, and I display different TextEditor controls in a TabControl after a Document list.
The WPF code of the TabControl :
<TabControl
Grid.Row="0"
ItemsSource="{Binding OpennedFiles, UpdateSourceTrigger=PropertyChanged}"
DisplayMemberPath="Data.Name"
SelectedItem="{Binding SelectedFile, UpdateSourceTrigger=PropertyChanged}">
<TabControl.ContentTemplate>
<DataTemplate>
<AE:TextEditor ShowLineNumbers="True" FontFamily="Consolas" Unloaded="TextEditor_Unloaded" FontSize="16" Loaded="TextEditor_Loaded" Document="{Binding Document}" SyntaxHighlighting="Python" />
</DataTemplate>
</TabControl.ContentTemplate>
</TabControl>
My problem is that when you change the selectionned tab, the caret offset of the previously selected document is reset to 0, which is really annoying.
I've tried to bind the caret offset property of the text editor, but it's not a dependency property, and since I'm not really sure it would work, I did not have the courage to create an attached dependency property.
I suspect that it comes from the fact that the Document is reloaded in the text editor at the tab selection, and since the caret offseet seems to depend from the TextArea, it returns to its default value, but I still don't have any idea on how to avoid this.
Any hints ?
try saving the caret offset to a database and then set the values back during loading of the texteditor
this.ScrollToVerticalOffset(value1); //top offset of the editor (example line 120)
this.TextArea.Caret.Line = value2; //value of the cursor line
Related
I'm creating a ListBox with items that have a portion of the text highlighted. This would normally be a search term, but for this simple example I'm just using "NEW". The highlighting works (lifted from a tutorial), but when mouse is over the text portion of the ListBoxItem it does not get the blue highlight and cannot be selected. Clicking in the white space to the right of the text does allow it to be selected. How can I fix the Runs so that they accept the mouse hover and selection?
Sample VS solution utilizing WPF: https://www.dropbox.com/s/m8bhogp3k75rkoj/RunHoverTest.zip?dl=0
Left side of window is normal ListBox, right side is with highlighting applied in OnLoaded event.
I looked into adding a mouse hover event to the Run but got stuck on how to pass it down to the TextBlock. Any suggestion to do the highlighting differently to make it work is also welcome. Thanks.
Create an explicit DataTemplate in the view:
<ListBox Name="HighlightedListBox" Grid.Column="1" ItemsSource="{Binding AllStates}"
Loaded="ListBox_OnLoaded">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
This should make the items selectable.
I do not manage to properly set the width of my XAML ToggleSwitch.
My code is as follows:
<Controls:ToggleSwitch OnLabel="True"
OffLabel="False"
IsEnabled="{Binding CheckValueEnable}"
IsChecked="{Binding CheckValue, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Width="250" >
</Controls:ToggleSwitch>
Whatever Width value I set, there is a too big spacing between the text (true / false) and the visual toggle button.
How can I decrease this spacing?
I would guess your issue (over exaggerated a little) is something like this:
{O }___________True
What you want is:
{O }__True
Without knowing the control it is a bit difficult but i would guess you only option is to modify the ToggleSwitch's ControlTemplate to define the content presenter position
EDIT:
Further to that, you might find the following article useful as it describes the process of editing controls in XAML
http://docs.telerik.com/devtools/wpf/styling-and-appearance/styling-apperance-editing-control-templates
In our application we have a screen design feature which is comprised of a custom ScreenDesignPanel and a Property Grid with a ComboBox at the top which points to the selected item on the ScreenDesignPanel. This allows the user to select the UIElement via the ComboBox or via the mouse to set its properties. We achieve this by binding the ItemsSource of the ComboBox to the ScreenDesignPanel's Children collection, then binding their SelectedItems together. This works great.
However, for whatever reason, if the SelectedItem is a ContentControl or a subclass like Button the ItemTemplate specified for the ComboBox is ignored for the 'selected item area' but it is applied when displaying the item in the dropdown list. If the SelectedItem is not a ContentControl, the template is used in both cases.
This also is seemingly specific to the ComboBox. If we use any other selector control: ListBox, ListView, ItemsControl... even third-party ComboBox controls... they all work as expected, properly applying the DataTemplate. ComboBox is doing something internally which no other control is doing.
Note: Below is an over-simplified example for illustrative purposes of the issue only. It is not how we're actually using it as described above.
Also of note: In the DataTemplate for the ComboBox.ItemTemplate, we are only using properties (i.e. Foreground in the example), and are not displaying the DataContext (i.e. the actual ContentControl) itself. This is important because again, the actual control already exists on the ScreenDesignPanel and therefore can't be used for display in the ComboBox's ItemTemplate as it would have two parents which isn't allowed. In other words, it is being used purely as data here.
One last thing... we have a working solution in our app, which was to wrap the Children before binding it to the ComboBox.ItemsSource. However, I'm still curious as to why the ComboBox behaves the way it does which is SPECIFICALLY what I'm asking. (In other words, I'm not looking for other solutions to this design. We already have a working one. I'm looking for clarity on the odd behavior of the ComboBox itself.)
On to the code!
In the first example below, note how the data template is applied to everything in the dropdown, but the selected item area only uses a template if the selected item is not a ContentControl.
<ComboBox>
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="I am the template" Foreground="{Binding Foreground}" />
</DataTemplate>
</ComboBox.ItemTemplate>
<!-- Four 'Data' items for example only -->
<TextBlock Text="I am a Red TextBox" Foreground="Red"/>
<ListBox Foreground="Purple">
<ListBoxItem>I am a Purple ListBox</ListBoxItem>
</ListBox>
<ContentControl Content="I am a Blue ContentControl" Foreground="Blue" />
<Button Content="I am a Button with Green text" Foreground="Green" />
</ComboBox>
This second example shows that it is completely acceptable and fully supported to use a UIElement as the content of a ContentPresenter and still use a DataTemplate (via ContentTemplate) so you can use it in a purely-data role, allowing the template itself to define the visual appearance without displaying the UIElement itself, which is used purely as data here.
<ContentPresenter>
<ContentPresenter.ContentTemplate>
<DataTemplate>
<TextBlock Text="I am the ContentTemplate" Foreground="{Binding Foreground}" />
</DataTemplate>
</ContentPresenter.ContentTemplate>
<ContentPresenter.Content>
<Button Content="I am the button" Foreground="Green" />
</ContentPresenter.Content>
</ContentPresenter>
Again, the issue is specific to a ComboBox. I want to find out why the data template isn't applied in that single case, and how to force it to be applied, if possible.
Of note, ComboBox does define SelectionBoxItemTemplate which is separate from the regular ItemTemplate but the rub is that is read-only so you can't set it. We really don't want to re-template the ComboBox as that can mess up proper theming.
Have you tried explicitly setting the DataTemplate to the ContentControl.ContentTemplate property?:
<UserControl.Resources>
<DataTemplate x:Key="DataTemplate">
<TextBlock Text="{Binding Content,
StringFormat='Displayed via template: {0}'}" />
</DataTemplate>
</UserControl.Resources>
...
<ContentControl Content="ContentControl"
ContentTemplate="{StaticResource DataTemplate}" />
I'm having a problem with the autocompletebox from the toolkit for windows phone. I bind it to some data, then when i press it and start typing, it discovers some items but they are displayed wrong (the list is shown separated from the box, and also if i click on any item, nothing happens. If i click where the item would be supposed to be (for example, right on the top of the box), then it gets selected. It looks like a rendering problem (bug?)) but perhaps i'm doing something wrong. Here's the code for the box :
<DataTemplate x:Key="DataTemplate1">
<ContentControl Content="{Binding Name}" Margin="8,7"/>
</DataTemplate>
<toolkit:AutoCompleteBox ItemsSource="{Binding}" x:Name="txtSelectValues" MinWidth="250" Margin="0,0,0,0" ItemTemplate="{StaticResource DataTemplate1}" VerticalAlignment="Top" />
Found it. It's a bug with the AutoCompleteBox. When inside a scrollviewer control, the dropdown gets messed up and displayed in an incorrect position
Its not just that is also to do with being placed inside of a Pivot/Panaroma as well as the scrollviewer, the silverlight gurus have stated they haven't a timeline for the fix for the Pivot control, and there is a nasty hack
http://silverlight.codeplex.com/workitem/7574
I think the answer might just be that you shouldn't be using a ContentControl directly used like this. Try using something like a TextBlock instead - e.g.:
<DataTemplate x:Key="DataTemplate1">
<TextBlock Text="{Binding Name}" Margin="8,7"/>
</DataTemplate>
If that's not the answer, then try pulling back to a simple example - especially removing all the Margin's, Width's, Alignment's, etc - then put them back in one-by-one to work out and understand what is causing the effect you are seeing.
My problem is rather simple.
I have a ListBox, containing Thumnails (Image)
<ListBox Name="ListBox_Thumbnails" ItemsSource="{Binding}" DataContext="{Binding Source= {StaticResource ThumbnailListSource}}" Width="120" HorizontalAlignment="Left" Margin="-1,26,0,54">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<Image Source="{Binding Path=absolutePath}" MouseLeftButtonDown=<!--?????-->/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
I wanted to show an image, but as a new StackOverFlow user, I can't. You can find the image here:
http://www.freeimagehosting.net/uploads/61aa983cad.jpg
(For those who don't trust me, I explain here the content of the image:
On the left, there is a list of thumbnails (displayed vertically) and on the right there is a bigger image, corresponding per default to a large image of the first thumbnail).
When I click on a thumbnail (on the left), the large image on the right should be updated by the one that I clicked on.
As I am new with WPF, my approach is perhaps totally wrong with the ListBox.
Please, WPF Gurus, show me the light!
I guess, you can use events on ListBox, smth like SelectionChanged... but that's totally not the TRUE WPF-Jedi way -- remember, code-behind is the dark side! =)
Think data binding, that's the Force. Bind your large Image element's source to the SelectedItem property of the ListBox. It should look like
<Image Source="{Binding SelectedItem.absolutePath, ElementName=ListBox_Thumbnails}">
P.S. Every WPF-databinding-jedi should have this cheat sheet nearby.
P.P.S. Actually, as you're using ItemTemplate this might not work, you'll have your StackPanel as the selected item... in this case you can try the SelectedValuePath trick, set it to "absolutePath" and bind the large image to the SelectedValue property.
So your ListBox opening tag becomes:
<ListBox Name="ListBox_Thumbnails" ItemsSource="{Binding}" DataContext="{Binding Source= {StaticResource ThumbnailListSource}}" Width="120" HorizontalAlignment="Left" Margin="-1,26,0,54" SelectedValuePath="absolutePath">
And your large image tag becomes:
<Image Source="{Binding SelectedValue, ElementName=ListBox_Thumbnails}">