WPF - How to access a control in a GridView templated cell - wpfdatagrid

There are similar topics here, but none of the resolutions have helped me.
I have the following:
<ControlTemplate x:Key="PlateWellControlTemplate"
TargetType="{x:Type ContentControl}">
<Grid x:Name="PART_stateGrid"
Margin="0,0,5,0">
<Ellipse Fill="#FF252526"
MinWidth="34"
MinHeight="34"
HorizontalAlignment="Center"
VerticalAlignment="Center"/>
<Ellipse x:Name="PART_stateControl"
Fill="#FFE6E6E6"
MinWidth="32"
MinHeight="32"
HorizontalAlignment="Center"
VerticalAlignment="Center"/>
<Label FontWeight="Bold"
FontFamily="Verdana"
Foreground="Black"
Background="#00000000"
HorizontalAlignment="Center"
HorizontalContentAlignment="Center"
VerticalAlignment="Center"
Content=""/>
</Grid>
</ControlTemplate>
Used here:
<DataGridTemplateColumn Header="2">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Grid Tag="{Binding WellX2}"
x:Name="wellX2"
MouseDown="well_Click">
<ContentControl Template="{DynamicResource PlateWellControlTemplate}"/>
Then accessed here in code-behind:
DataTemplate cellTemplate = (DataTemplate)cell.Template.FindName("PART_stateControl", cell);
Where "cell" is a non-null DataGridCell using the template. The above line always returns null and I do not understand why. I have also tried as a ControlTemplate and a ContentPresenter.
What I need is a reference to the Ellipse ("PART_StateControl") in the DataGridCell I've been handed as I need to change one of it's properties. But in general, how do I get to named items in the ContentControl Template? This is all triggered by a click event on the parent Grid control referenced in the DataGridTemplateColumn.CellTemplate here named "wellX2". Again, there are a few discussions on here regarding this, but none have helped. I feel like there's something silly missing. This has to be doable.
Thanks in advance for any help you can afford.

Answer found as a combination of this:
Getting a control from a DataGridCell
and this:
How to Get element inside the content control
Brilliant!

Related

Apply Parallax effect into GridView

https://learn.microsoft.com/en-us/windows/uwp/design/motion/parallax
this is microsoft instruction to use the paralax they use the ListView to demo the effect
but my data is stored inside the Grid.View so can anyone show me how to implement into it ?
Microsoft said that we can use this with any element that contain the scrollviewer
ParallaxView works with GridView. The Source property of ParallaxView is for setting the element that either is or contains the ScrollViewer that controls the parallax operation. Here in your code snippet it bind the ForegroundElement to Source property but no such an element in. You need to name the GridView as ForegroundElement .
<GridView
x:Name="ForegroundElement"
IsItemClickEnabled="True"
ItemClick="Grid_Clicked"
ItemsSource="{x:Bind Icons}">
...
</GridView>
Besides this, the code snippet should work well. If you still cannot see the effects it may be caused by items count is not enough. ScrollViewer inside the GridView or ListView only be shown when the host control's layout space is being constrained smaller than the expanded content size, details please see ScrollViewer in a control template. You could try to add more items to check the effects.
Additionally, edit the question to add more details and avoid to put it as an answer.
<GridView Grid.Row="1" ItemsSource="{x:Bind Icons}" IsItemClickEnabled="True" ItemClick="Grid_Clicked">
<GridView.ItemTemplate>
<DataTemplate x:DataType="data:Icon">
<StackPanel>
<Image Width="200" Height="200" HorizontalAlignment="Center" Source="{x:Bind ImageCover}"/>
<TextBlock FontSize="16" VerticalAlignment="Center" Text="{x:Bind Title}"/>
<TextBlock FontSize="10" VerticalAlignment="Center" Text="{x:Bind Room}"/>
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
this is where the data stored
and this is the parallax
<ParallaxView Source="{x:Bind ForegroundElement}" VerticalShift="50">
<!-- Background element -->
<Image x:Name="BackgroundImage" Source="Assets/turntable.png"
Stretch="UniformToFill"/>
</ParallaxView>

Screen does not display full content of string

i'm using the textblock to display the content,but for the long content, it just cut off and not display the content fully while i'm sure that the i filled the content string. Pls show me where my code is wrong. Thanks
Link of the my screen: www.flickr.com/photos/37903269#N05/15332152972/
my xaml code :
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<!-- <phone:WebBrowser VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Name="webBrowser1" /> -->
<ListBox Name="Listbox_DetailPage">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Content}"
TextWrapping="Wrap"
Style="{StaticResource PhoneTextNormalStyle}"
HorizontalAlignment="Center"
/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</Grid>
I executed the code shared and it seems to wrap text as shown in the screen shot below.
The screenshot you shared seems to have vertical cropping of the text as well. For that, we can set the ScrollViewer.VerticalScrollBarVisibility to 'Auto' with proper Height given.
Also, for your additional knowledge or may be future use, here are some stackoverflow questions which explains the text 'NOT WRAPPING' issue for StackPanel
TextBlock TextWrapping not wrapping inside StackPanel
TextBlock TextWrapping not wrapping
actually, i fixed it.Because of the limitation of sing UI: 4096px limit of size. So there is a need to split the long content in the more than one TextBlock or you can create a scrollabe textbock as here

How do I add text inside a shape in XAML

I am working on a Metro App using C++ and XAML. I want to create a polygon shape and add text inside it.
At first I thought of defining my own Controltemplate and apply it to Textblock but unfortunately it does not understand TargetType = "TextBlock".
Secondly, I thought of inheriting the Polygon class and see if I can do anything there but that class is sealed.
Any ideas on how to achieve this?
In WPF XAML you could do something simple like this:
<Grid Width="60" Height="100">
<Ellipse Fill="Yellow"/>
<TextBlock VerticalAlignment="Center" HorizontalAlignment="Center" Text="Hello"/>
</Grid>
To get text in the centre of a yellow ellipse.
I'm guessing something that simple will work on WinRT.
You can use something like this with ContentControl or so many other controls:
<ContentControl Width="200" Height="100" Content="Something">
<ContentControl.Template>
<ControlTemplate>
<Grid>
<Ellipse Fill="Red"/>
<TextBlock Text="{Binding Content,RelativeSource={RelativeSource FindAncestor,AncestorType=ContentControl}}"
TextWrapping="Wrap"
VerticalAlignment="Center"
HorizontalAlignment="Center"/>
</Grid>
</ControlTemplate>
</ContentControl.Template>
</ContentControl>

Share context menu in WP7 xaml

I want to add a contextmenu to items in a listbox. Typically the answer is to add the contextmenu to the root of the item template. However, I am using a template selector, so there are multiple templates in use, depending on the data of each item in the listbox. This means I need to add the same contextmenu definition to each template, which is not very appealing.
One solution is to wrap the datatemplate in a ContentControl, which would give me a single place for the context menu definition. However, I believe this would add layout overhead that isn't necessary.
Another solution I tried is adding the ContextMenu to the resource dictionary, but I believe this ends up sharing the same object instance across all the uses, and due to the way ContextMenu is implemented, this also does not work.
A third solution is using the Loaded event to call a function which populates the context menu appropriately. However, this ends up moving a lot of code that ought to be in the XAML into code, and looks quite ugly. If there's some way of defining the context menu in xaml, and then just referencing that from code, I would find it appealing, but I don't quite see how to do that.
What is the right way to share the same ContextMenu across the templates in a template selector?
This is the ContentControl method, which works, but ends up adding two content controls to each item:
<ListBox.ItemTemplate>
<DataTemplate>
<ContentControl>
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu Loaded="ContextMenu_Loaded">
<toolkit:MenuItem Header="Delete"/>
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
<ContentControl ContentTemplate="{StaticResource MyTemplate}" Content="{Binding}"/>
</ContentControl>
</DataTemplate>
</ListBox.ItemTemplate>
How about adding the ContextMenu to the TemplateSelector?
<ListBox ItemsSource="{Binding}">
<ListBox.Resources>
<DataTemplate x:Key="MyTemplate">
<StackPanel>
<TextBlock Text="{Binding}" />
</StackPanel>
</DataTemplate>
</ListBox.Resources>
<ListBox.ItemTemplate>
<DataTemplate>
<local:CustomTemplateSelector Content="{Binding}">
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu>
<toolkit:MenuItem Header="Delete"
Click="MenuItem_Click" />
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
<local:CustomTemplateSelector.TemplateOne>
<DataTemplate>
<ContentControl Content="{Binding}"
ContentTemplate="{StaticResource MyTemplate}"
Foreground="Blue" />
</DataTemplate>
</local:CustomTemplateSelector.TemplateOne>
<local:CustomTemplateSelector.TemplateTwo>
<DataTemplate>
<ContentControl Content="{Binding}"
ContentTemplate="{StaticResource MyTemplate}"
Foreground="Red" />
</DataTemplate>
</local:CustomTemplateSelector.TemplateTwo>
<local:CustomTemplateSelector.TemplateThree>
<DataTemplate>
<ContentControl Content="{Binding}"
ContentTemplate="{StaticResource MyTemplate}"
Foreground="Yellow" />
</DataTemplate>
</local:CustomTemplateSelector.TemplateThree>
</local:CustomTemplateSelector>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I ran this and it worked for me - give it a try and let me know if this was the effect you were looking for or not.

ProgressbarStyle issues

I have a ProgressbarStyle in which I add a TextBlock-Control to the Grid "DeterminateRoot". This TextBlock should display a Status-Text, which I change manually in CodeBehind and this works already.
Here is the part of my style, which I change in the standard ProgressbarStyle:
<Grid x:Name="DeterminateRoot" Margin="1">
<Rectangle x:Name="ProgressBarIndicator" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Left" Margin="{TemplateBinding BorderThickness}" RadiusY="1.5" RadiusX="1.5" StrokeThickness="0.5"/>
<TextBlock x:Name="txtbStatusText" Text="5 of 20" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="Black" FontWeight="Bold" FontFamily="Arial" FontSize="11"></TextBlock>
</Grid>
My question is: How can I change the Foregroundcolor of the TextBlock-Text to black, without changing the standardcolor of the progressbar? Because, when I delete the Fill-Property of the Rectangle (ProgressBarIndicator), then I can change the ForegroundColor of my TextBlock, but I want to keep the standardlook of the Progressbar!
Thank you in advance for your answers!
Best Regards
Dougy
As you are stating, if you set booth properties to the same TemplateBinding your text will be invisible. You have to create another property so you can manage them independently.
Create in your code a dependency property of type Brush and then template binding your TextBlock to that property.