ContentControl not showing up without specifying width/height - c#

I am using CefSharp in my WPF project. I'm adding the CefSharp.Wpf.WebView class to my MainWindow.xaml like so:
_webView = new WebView(url, _settings);
My XAML layout looks like this:
<Window x:Class="WPFContainer.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Test Project" Height="400" Width="930" Initialized="OnWindowInit" StateChanged="OnWindowStateChanged" Closing="OnWindowClose">
<DockPanel Name="MainDockPanel" Height="400" Width="930">
<Grid VerticalAlignment="Top" HorizontalAlignment="Left" ShowGridLines="True" Name="mainGrid" >
<Grid.ColumnDefinitions>
<ColumnDefinition Name="col1" Width="600" />
<ColumnDefinition Name="col2" Width="330"/>
</Grid.ColumnDefinitions>
</Grid>
</DockPanel>
</Window>
If I remove the Grid and add the webView to the DockPanel directly, it shows up just fine. But if I try to add the webView to col1 in the Grid, it doesn't display. It will display in the grid column if I specify a Width/Height, but HorizontalAlignment.Stretch doesnt work and I need 100% width and height!
My code for adding the webView to the Grid which doesn't work:
mainGrid.Children.Add(_webView);
Grid.SetColumn(_webView, 0);

The problem is that the Children property is populated in InitializeComponent. If you are adding children to the grid after it has been initialize, there is no property changed event for adding to the Children collection, as it is not an ObservableCollection. If you were to create a new collection I believe it would work programmatically, but that can be avoided by defining your webview in xaml (provided it has a paramaterless constructor). Then OnLoaded you can inject url and settings.

Related

Make region fullscreen in PRISM application by stretching user control

I am creating application using PRISM library. Currently i had only one region. Inside this region i put a user control with my view (as you can see below). Is just a some menu with property grid and a list to display data.
My user control:
By default my main window is full screen. When I run my application there are some remaking blank space below my user control.
Question:
How i can stretch my user control to fill all available space? As on picture below
What i've done:
- My user control container currently is DockPanel i tried put it to grid and other controls
- Delete user control sizes (width and height)
- Use viewbox inside shell.xaml (it destroys everything)
- Put user control to different cotainers inside shell.xaml
Currently shell.xaml is my "main window" I has only window tags with my user control.
I find similar questions on stack overflow but nothing helped me.
--- UPDATE ---
This is example of my user control code:
<UserControl x:Class="NewPrj.View.FullScreenTest"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
mc:Ignorable="d">
<DockPanel Background="Blue" LastChildFill="True" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<Menu DockPanel.Dock="Top">
<MenuItem Header="_New"/>
<MenuItem Header="_Something"/>
</Menu>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="350" />
</Grid.ColumnDefinitions>
<xctk:PropertyGrid Grid.Column = "1"
>
</xctk:PropertyGrid>
</Grid>
</DockPanel>
This is my shell.xaml window
<Window x:Class="NewPrj.Shell"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:NewPrj"
xmlns:prism="http://www.codeplex.com/prism"
mc:Ignorable="d"
WindowState="Maximized"
Title="New Prj" MinHeight="600" MinWidth="800">
<Grid>
<ItemsControl Name="MainRegion" prism:RegionManager.RegionName="MainRegion" />
</Grid>
And this is actual result:
As I said before, there are many related topics but it does not work.
Reason:
This was not fully stretched because i use ItemsControl which use stack panel as default data template
Solution:
Change data template of ItemsControl or use User Control instead
<UserControl Name="MainRegion" prism:RegionManager.RegionName="MainRegion"/>
I found answer here

Syncfusion GridDataControl nested in a TabControl: Column auto-resizing broken after switching tabs

I am rather new to WPF. On .NET 3.5 using C# I want to build a WPF application including Syncfusion's GridDataControl in a TabItem. The GridDataControl is supposed to auto-resize by specifying the column width in multiples of '*'. This works fine after the first start of the app. But after switching tabs and again switching back resizing is broken and the grid control remains fixed in size. Here is my xaml code:
<Window x:Class="SyncfusionGridData.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:SyncfusionGridData"
xmlns:syncfusion="http://schemas.syncfusion.com/wpf"
mc:Ignorable="d"
Title="MainWindow" Height="500" Width="525" DataContext="{Binding RelativeSource={RelativeSource Self}}">
<Grid>
<TabControl>
<TabItem Header="Tab1">
<Grid Name="layoutRoot">
<syncfusion:GridDataControl x:Name="dataGrid"
AutoPopulateColumns="False"
ShowAddNewRow="False"
ItemsSource="{Binding GDCSource}">
<syncfusion:GridDataControl.VisibleColumns>
<syncfusion:GridDataVisibleColumn Width="*"
HeaderText="ContactName"
MappingName="ContactName">
</syncfusion:GridDataVisibleColumn>
<syncfusion:GridDataVisibleColumn Width="*"
HeaderText="ContactTitle"
MappingName="ContactTitle">
</syncfusion:GridDataVisibleColumn>
</syncfusion:GridDataControl.VisibleColumns>
</syncfusion:GridDataControl>
</Grid>
</TabItem>
<TabItem Header="Tab2">
<Label Content="2" />
</TabItem>
</TabControl>
</Grid>
where 'GDCSource' is an ObservableCollection of 'Person' and 'Person' has the properties 'ContactName' and 'ContactTitle'.
I tried using Syncfusion's own tab control (TabControlExt) but this shows the same behaviour. Not specifying the ItemsSource property and displaying only the header row shows proper resizing.
I do not really have an idea what this might be related to. Thanks for any help!
AutoSizing fails as soon as the GridDataControl is Unloaded.
Add the following property to your TabControlExt to prevent Unloading of the Tabs after they have been loaded.
IsDisableUnloadTabItemExtContent="True"

How to prevent the Content of a UserControl from being overridden?

I'm new to Windows 10 app development. I'm trying to embed my custom UserControl in a page in my application. For some reason, the content is being completely replaced by whatever I put inside it in the XAML page. To give a better explanation, here is the code:
AppView.xaml (the control)
<UserControl
x:Class="Sirloin.AppView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Sirloin"
xmlns:h="using:Sirloin.Helpers">
<SplitView x:Name="splitView" DisplayMode="CompactOverlay">
<SplitView.Pane>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<!--The hamburger-->
<Button Click="OnHamburgerClicked" Grid.Row="0" Style="{StaticResource MenuButtonStyle}">
<Button.DataContext>
<local:MenuItem Symbol=""/>
</Button.DataContext>
</Button>
<!--Buttons just below the hamburger-->
<ListView x:Name="topView"
Grid.Row="1"
ItemTemplate="{StaticResource ListViewItemTemplate}"/>
<!--Buttons toward the bottom of the menu-->
<ListView x:Name="bottomView"
Grid.Row="3"
ItemTemplate="{StaticResource ListViewItemTemplate}"/>
</Grid>
</SplitView.Pane>
<SplitView.Content>
<!--Where I'd like the content specified in MainPage to appear-->
<Frame x:Name="frame" Background="White"/>
</SplitView.Content>
</SplitView>
</UserControl>
MainPage.xaml
<Page
x:Class="Sirloin.Example.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:s="using:Sirloin"
xmlns:local="using:Sirloin.Example">
<s:AppView>
<Grid Background="White">
<TextBlock HorizontalAlignment="Center"
VerticalAlignment="Center"
Text="Hello, world!"/>
</Grid>
</s:AppView>
</Page>
When MainPage renders in the VS designer, it's as if the contents of my user control have been completely gutted out and replaced with whatever is specified in the main page. To give you an idea, here is a screenshot of the designer:
As you can see, there is no menu or SplitView or whatever I've put in my custom control; the only thing that's present is the TextBlock I've specified in the XAML for MainPage.
Anyway, why does this happen and what can I do to fix it?
EDIT: Found the solution I was looking for here, but Peter Duniho's answer has been accepted as it provides a better explanation of what's going on.
UserControl is a subclass of Control (which is similar to WPF's ContentControl). It can have only one child. So you are explicitly overriding the content yourself. By specifying a child element for your AppView in the Page XAML, you are setting the content of the control. This takes precedence over whatever content was specified in the UserControl's own XAML.
Unfortunately, it's not very clear what it is you expected to happen. Maybe you want to provide a property for additional content, which the AppView class can use to add to its own content. Or maybe you should be allowing the client code to provide a DataTemplate and some kind of data item object (e.g. model class), which is used in a ContentPresenter or similar in the AppView XAML.
But whatever you're trying to do, you'll have to do it without using, and overriding the current value of, the implicit Content property of the UserControl in the Page XAML.

Changing BackGround color of combobox when ItemsSource is set

I have a wpf c# app.
I am using a combo box and I set the ItemsSource to my Observable collection.
what I would like is the background of the combo box not to be grey.
This control is housed in a UserControl.
<UserControl x:Class="InformedWorkerClient.UserControls.ucJobStatus"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:InformedWorkerClient.UserControls"
mc:Ignorable="d"
d:DesignHeight="27" d:DesignWidth="300" Background="White">
<Grid Background="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<ComboBox x:Name="cboJobStatus" Grid.Row="0" Grid.Column="0" Background="White"
DisplayMemberPath="Description"
SelectedValuePath="JobStatusRef"
SelectedValue="{Binding Path=JobStatus}" SelectionChanged="cboJobStatus_SelectionChanged" />
</Grid>
Additional:
This is what the background looks like after item is selected. I want the background to be white
You cannot do this due to a bug in the ControlTemplate for ComboBox.
Potential solution is to copy/edit the template and create your own.
This question is a duplicate. Perhaps the answer there can be updated with some more information. I searched for wpf cant change background of combobox and the top link is the MSDN answer on how to copy the template but even then the solution is riddled with issues with different Windows versions, aero theming, and does not address situations where users have high contrast turned on, and other accessibility issues.
I would recommend to use <ComboBox.ItemContainerStyle> and setup Background to Transparent for the container. Then each item background will be as in the ComboBox.

WPF UserControl Not Displaying

I deleted my previous question to rephrase appropriately, since my previous post was neither helpful nor complete, imo.
For clarity: I'm using the Prism framework and abiding by a strict MVVM pattern.
Problem: When I load a UserControl, defined in some module, ModuleA, it does not display in the Shell view. However, if I load my UserControl within an ItemsControl, the elements I have defined appear, but they are all 'squished together'.
In ModuleA, I have the following UserControl:
<UserControl ...
...>
...
<Grid>
... My Content Here ...
</Grid>
</UserControl>
Now, in my project, I have defined the Shell thusly:
<Window ...
...>
...
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="10"/>
<RowDefinition Height="10"/>
<RowDefinition Height="10"/>
</Grid.RowDefinitions>
<Border Grid.Row="0" .../>
<UserControl Grid.Row="1" prism:RegionManager.RegionName="ModuleARegion"/>
<Border Grid.Row="2" .../>
</Grid>
</Window>
Now, in this scenario, everything loads, and ModuleA is recognized, but nothing appears on the screen.
However, if I change the <UserControl Grid.Row="0" prism:RegionManger .../> to <ItemsControl Grid.Row="0" prism:RegionManager .../>, I can see the content I've laid out in my ModuleA UserControl, but the content is all 'squished together'.
Does anyone have any ideas as to why this might be happening?
The default region adaptors in Prism don't support UserControl. You need to use ContentControl, ItemsControl or a Selector based control like a ComboBox to get out of the box support or write your own region adaptor.
Note: The region adaptor is used to add and remove controls from regions of a certain type of control when you interact with its regions.

Categories

Resources