How to extend text selection across text blocks in a UWP app - c#

My app has a bunch of paragraphs which are compared together. This is implemented using a generic ItemsRepeater that creates as many Grid elements as there are paragraphs. Inside each grid is a TextBlock with the paragraph number, and a RichTextBlock that contains the paragraph. The hierarchy is therefore like this:
<ItemsRepeater>
<Grid>
<TextBlock />
<RichTextBlock></RichTextBlock/>
</Grid>
<Grid>
...
</Grid>
<Grid>
...
</Grid>
</ItemsRepeater>
This results in a text selection as follows:
Only one RichTextBlock can be selected at a time. However, I would like to allow text selection of all paragraphs of the ItemsRepeater. How is that possible?
Edit
I'm open to other approaches. I've tried manually filling in a StackPanel or RichTextBlock with items. That's not a problem. However, because the numbered paragraphs need to align, I need to be able to set their height to match each other. From what I can find, only elements that derive from FrameworkElement have the ActualHeight and Height properties I need for that. However, FrameworkElements like TextBlock and RichTextBlock also do not allow multiple selection, which is the problem I'm trying to solve in the first place. Someone posted a response to a similar question about WPF, but it uses a strange solution I don't think applies.
So the question could also be framed as: how is it possible to find and set the height of a Run within a TextBlock or RichTextBlock? Using that idea, it was impossible to get/set the run height inside a paragraph. I'm not bound to using ItemsRepeater, but that has also not yielded a useful result. I'm seeking to avoid resorting to HTML/Javascript for this.

UWP does not expose enough APIs for you to do that. I have worked on a similar issue with RichEditBox on UWP and there is no good solution that I have found. But if you really want to, there are two main approaches to achieve that:
Implementing the selection yourself by sniffing the mouse events and render the selection on top of the controls. There are so many corner cases, specially if you want to have a proper accessibility tree for the control that you are building.
Alternatively, you can create a WinRT C++ project where you would have access to more APIs, build a control and render it onto a canvas that is created with your C#/Xaml app.
The good news is that you are not permitting people to edit (RichTextEdit) and it is just view (RichTextBlock) so you do not have to worry about the automatic corrections, IME, Url detection, etc.
Edit: Originally I mentioned WinRT C++, but I meant C++/CX. It might work with WinRT too, but I have not tried.

Related

WPF Control Identification

Sorry but I am a newbie to WPF, I would really appreciate if you could help me-
Tag 1 in pic- Which control can I use to create a menu similar to that in the picture ? The closest I came was using a gridview within a listview but that ends up using a header for the gridview. Normal listview just highlights the entire strip and doesn't look good at all.
Tag 2 in pic // (No longer relevant, sorry)
Edit:
Looking for something simple like when using gridview with listview (as in pic below) there is automatically that standard window gradient & bevel effect etc. (As an idea, implementing it with buttons seems to cumbersome, first strip button border, then create all these effects.) So essentially anything already inbuilt in WPF.
Thanks for any help :-D !!!
ListBox or ListView are good controls to use. If it's just the 'pretty' factor you don't like, you can provide Templates to change the appearance. But functionally, ListBox and ListView provide the function of that menu.
When working with WPF, that should be your primary motivation when choose controls. What FUNCTIONS the way you want. You can always make it LOOK different with Templates, but getting the right FUNCTION is the primary goal for the control.

How to properly make custom templates which are images in xaml

I was assigned a very obscure project where basically every control, every design element is an image. I was provided with design files for every element of the app.
I even informed the people who gave the assignment that it's probably a very bad idea due to many different reasons, and it would be better to do everything manually but I still have to do it with images. Every time I add something - I see that everything is fine in the designer , but when I run it on my Lumia 925 everything shifts a little bit in different directions, even the buttons.
Any suggestions on the proper way to do this? To have custom templates for buttons which are basically images in a way it will not shift and I would see the same thing in the designer and on the device.
You have a great solution for controls called Behaviors, just add the extension in the project and add the following everywhere you need a Tap like the following, (that's an example just for tap you could use the event tap):
xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
<Image>
<Interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Tapped">
<core:CallMethodAction .../>
</core:EventTriggerBehavior>
...
</Interactivity:Interaction.Behaviors>
You have all the behaviors and actions here:
https://msdn.microsoft.com/en-us/library/microsoft.xaml.interactions.core.aspx
and how to add them in the project here:
http://blogs.windows.com/buildingapps/2014/07/22/tips-and-tricks-for-using-xaml-controls-in-your-universal-windows-apps/
Then add the logic in the methods you call from the images. There are plenty of behaviors done, to begin storyboards, to change properties...
Apart you can use a ViewBox control that it scales everything in the screen to not be scaling every image. Try that.

Edit the style/template of a control created from code-behind

I'm styling WPF's Calendar control and I've reached a point in XAML where there's a grid with no elements in it, just divided by rows and columns where the day numbers are.
I've snooped and decompiled (void PopulateGrids()) and have learned that in code-behind the Calendar is creating CalendarDayButton and feeding it to the grid.
I need to change the style/theme in-order to change the colors (of those CalendarDayButton) and I'm not sure how to do that.
I've tried applying a style to all CalendarDayButton in said grid, but that didn't work.
Any suggestions?
P.S. I'd rather stay away from code-behind because what I'm working on is a style in a resource-dictionary and not a user-control.
Go to the Microsoft page for Calendar Styles and Templates, copy the style code into your resources block and make changes as needed. If you need to create additional properties for settings etc then you can do so with an attached property, that way you don't need to create a new calandar control. If you're having difficulty figuring out which parts of the template correspond to things you're seeing on-screen then put a breakpoint in your code somewhere, add the calandar control variable name to your watch window and click on the little magnifying glass to bring up the WPF visualizer...that will let you traverse the visual tree and visually see which part of the control each section is rendering.

How to make message entry/list/view in C#

He I am a beginner to C# and I am working on a reaction manager plug-in for some bigger project. (Yes I am a intern)
Now I just can't find a way to create a view similar to this:
My full design:
How to realize this design? I cant find any default templates in the devexpress which are suitable for this. I come from php and in php I can use html. I am a beginner to C# and I don't have any clue on how t do this. Do I have to use canvas to literally draw this? OR is there a standard template I can use for this purpose.
You have many comment boxes that contain the same layout - a label comment text, author name, date, etc. There is no control that lays things out like that, you will have to make your own custom control (Project->Add User Control). This control will be a composite control - ie made up of other controls. Probably a label for each text field (comment, author, date, etc) laid out in the right places. Maybe call it CommentBox or something.
Then in the main form you now have available CommentBox controls which you can add to the form. Create a panel to put them in so you have many CommentBox controls in the panel, one for each comment (or maybe add them at runtime).
Now in WPF it's slightly easier because there is a StackPanel control that you can simply add controls to and it automatically arranges them vertically one beneath another in a stacked list. In fact your use case is exactly fitting what a StackPanel is for.
In WinForms there is no StackPanel, but you can use a normal Panel control*. It's just you'll have to position the CommentBox controls manually one beneath another. You will also need to set the AutoScroll property to true to turn on the vertical scroll bar if the content doesn't fit the view.
*or there's apparently an alternative How can I get a StackPanel-like layout in WinForms

Navigation menu for a standalone WPF application

Im just starting out with wpf (in blend 4) and i would like to create an application that has a side menu for changing the content. What i am looking for is something like in word 2010 under the file menu. if you click the menu on the left side the content on the right side changes accordingly. i have read articles about nesting a page.xaml into a frame and change the frames navigation source to each page. Is this right? When i do that a navigation bar appears at the top. I can get rid of that easy but it seems like i am taking the wrong path at what i want to achieve.
Thanks in advance.
Just to chime in on this, both the TabControl and the Frame-based solutions are somewhat like the extremes of a spectrum. The tab control effects a very close coupling between the tab state and the displayed UI (e.g., you might find it difficult to change to a dialog for which there is no explicit tab item), whereas the frame enables relatively loose coupling, but might be overkill for this scenario, as it aims to support full-blown linear navigation with a history/page stack. (Prism, for example, offers a similar mechanism through its "regions" concept.)
A middle ground could be to have a main "window frame" UI with a placeholder element, and have your individual "pages" derive from UserControl, making them regular UI elements. To switch to a specific page in your UI, you would instantiate (through code or XAML resources) the corresponding user control, and set it as the Content property of the aforementioned placeholder element. (This is basically the same mechanism you mentioned for VB, where you hide/show subforms.)
So there's a range of options to choose from, depending on the actual constraints of your scenario.
The simplest code to do that is creating a TabControl with TabStripPlacement="Left". For example :
<TabControl TabStripPlacement="Left">
<TabItem Header="Tab1" />
<TabItem Header="Tab2" />
<TabItem Header="Tab3" />
</TabControl>
You can apply Styles to further change UI, colors and look & feel.

Categories

Resources