Develop Reference

adding a image to button programmatically with text content [duplicate]

Cant make button in WPF app with image and text on it. My code is like this:
<Window x:Class="WindowR.One"
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:WindowR"
mc:Ignorable="d"
Title="One" Height="300" Width="300">
<Grid>
<StackPanel Orientation="Vertical">
<TextBlock Text="Click Here" />
<Image Source="D:\Skola\4. semester\TP\GIT folder\Visualko\Core\WindowR\Pictures\0.png" />
</StackPanel>
</Grid>
</Window>
But the text isnt above image..tried lots of tutorials from here..but none of them work properly

StackPanel arranges TextBlock next to Image. Try to use Grid
<Button Width="120" Height="50" >
<Grid>
<Image Source="D:\Skola\4. semester\TP\GIT folder\Visualko\Core\WindowR\Pictures\0.png" />
<TextBlock Text="Click Here"
VerticalAlignment="Center"
HorizontalAlignment="Center" />
</Grid>
</Button>

WPF Scrollviewer won't show in ListView if contains one item bigger then ListView itself

I have problem in my application where I have ListView with dynamic items. Items might have variable height. In case there is a one item and its height is bigger than height of whole ListView, ScrollViewer won't show.
Problem could be simplified in following example:
<Window x:Class="WpfApplication15.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow"
Width="300"
Height="200">
<ListView Height="100" Margin="10">
<ListViewItem Height="150" Background="LimeGreen">
<TextBlock Text="ITEM" />
</ListViewItem>
</ListView>
</Window>
Why is that? Is there anything I can do with it?

Try to set the VirtualizingPanel.ScrollUnit attached property to Pixel:
<ListView Height="100" Margin="10" VirtualizingPanel.ScrollUnit="Pixel">
<ListViewItem Height="150" Background="LimeGreen">
<TextBlock Text="ITEM" />
</ListViewItem>
</ListView>

WPF Extended Toolkit Control in Custom Control not pulling through to form?

I am using the Xceed Extended WPF Toolkit for the Integer Up Down Control. I have installed this via Nuget.
I have the integrated into a custom control which contains other normal textboxes and button etc.
This custom control I then put in a tab control on a Window. Everything shows correctly apart from this IntegerUpDown which shows as an empty box. (It is fine when looking at the custom control in design)
I have added the namespace to both the control and window so am not sure what the problem is. Everything is inside one project so I don't think references are a problem.
Any ideas of what I could be missing?
Control XAML:
<Label Grid.Row="3" Content="Quantity of Tickets:" VerticalAlignment="Center"></Label>
<xctk:IntegerUpDown Grid.Row="3" Grid.Column="1" Name="numTickets"></xctk:IntegerUpDown>
Form XAML:
<TabItem Header="New Booking">
<Grid Background="#FFE5E5E5">
<btc:NewBooking></btc:NewBooking>
</Grid>
</TabItem>
Thanks,
Ryan

Here's a MCVE:
MainWindow:
<Window
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:WpfApplication8"
x:Class="WpfApplication8.MainWindow"
mc:Ignorable="d"
Title="MainWindow" Height="300" Width="300">
<Grid>
<TabControl x:Name="tabControl" Margin="0">
<TabItem Header="TabItem 1">
<Grid Background="#FFE5E5E5">
<local:UserControl1></local:UserControl1>
</Grid>
</TabItem>
<TabItem Header="TabItem 2">
<Grid Background="#FFE5E5E5"/>
</TabItem>
</TabControl>
</Grid>
UserControl:
<UserControl x:Class="WpfApplication8.UserControl1"
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"
xmlns:local="clr-namespace:WpfApplication8"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Grid>
<StackPanel>
<Label Grid.Row="3" Content="Quantity of Tickets:" VerticalAlignment="Center"></Label>
<xctk:IntegerUpDown Grid.Row="3" Grid.Column="1" Name="numTickets"></xctk:IntegerUpDown>
</StackPanel>
</Grid>
Both MainWindow and UserControl are at the same level in the project structure:
EDIT: One more thing, make sure your UserControl is fully contained by the MainWindow and you do NOT have something like this:
That would cause the IntegerUpDown look like an empty box, like you described.

Re-size page inside window WPF

I have a window with a tabcontrol inside of it, and each tabitem will parent a frame, which is bound to a page object. But I can't seem to be able to make the frame/page resize to fit the "main window". Here's the code I have:
<controls:MetroWindow x:Class="Mplayer.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
Title="Mplayer"
Initialized="Window_Initialized" Height="770" Width="1125">
<TabControl HorizontalAlignment="Left" Height="45" VerticalAlignment="Top" Width="1125" Margin="0,0,0,0">
<TabItem Header="Home" x:Name="HomeTab">
<TabItem.Content>
<Frame Source="HomePage.xaml" Margin="0,0,7,-697"/>
</TabItem.Content>
</TabItem>
</TabControl>
</controls:MetroWindow>
And here's the "HomePage.xaml"
<Page x:Class="Mplayer.HomePage"
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"
mc:Ignorable="d"
Height="770" Width="1125"
Title="HomePage" Foreground="Black">
<Grid Background="#373737">
<Grid Background="#585858" HorizontalAlignment="Left" Width="400"/>
</Grid>
</Page>
I hope you understand my question, and thanks in advance :)

Remove harcoded height and width from page definition as well as TabControl definiton:
Height="770" Width="1125"

You set the height and width for TabControl and HomePage explicitly. Remove those values both in Page and TabControl.
<TabControl>
<TabItem Header="Home" x:Name="HomeTab">
<Frame Source="HomePage.xaml"/>
</TabItem>
</TabControl>

how do i get my datagrid to grow with the window and maintain margins?

Everything about my layout will flow with the resizing of the main window. The problem I'm facing is that as you can see, the datagrid goes off the screen. If you maximize the window, the datagrid will resize with the window, but continue to go off the screen. How do I get it to maintain its margin of 20 with it's parent grid?
<Grid>
<StackPanel Orientation="Vertical">
<TextBox Height="170" Name="txtSQL" VerticalAlignment="Top" AcceptsReturn="True" TextWrapping="Wrap" Margin="20"/>
<Button Content="Run!" Height="23" HorizontalAlignment="Left" Name="btnRun" VerticalAlignment="Top" Margin="20,0,0,0" Width="75" Click="btnRun_Click" />
<Grid>
<my:DataGrid Name="dgResults" VerticalAlignment="Top" Margin="20" />
</Grid>
</StackPanel>
</Grid>
UPDATE:
Just to be more specific. The effect I'm trying to accomplish here is this:
When the window first loads, you are presented with a blank datagrid, so it's only about 15 pixels high. When you run the query, it will populate the datagrid by reassigning the itemssource. As of now, when you do that, if the data exceeds the window size, it will go off the bottom of the screen. I need it to only expand to the bottom of the window then enable the scrollbar. I can do this just by wrapping it in a scrollviewer im sure. However, when the window is resized, the datagrid needs to resize with it.
I'm wondering if the setup might have something to do with it. The form is actually a wpf page being displayed in a frame.
UPDATE:
<Page x:Class="Hold_Database___Prototype_1.Views.SQL"
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"
mc:Ignorable="d"
d:DesignHeight="304" d:DesignWidth="732"
Title="SQL" xmlns:my="http://schemas.microsoft.com/wpf/2008/toolkit" AllowDrop="True">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition Height="23" />
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBox Height="170" Name="txtSQL" VerticalAlignment="Top" AcceptsReturn="True" TextWrapping="Wrap" Margin="20" Grid.Row="0"/>
<Button Content="Run!" Height="23" HorizontalAlignment="Left" Name="btnRun" VerticalAlignment="Top"
Margin="20,0,0,0" Width="75" Grid.Row="1" Click="btnRun_Click" />
<DockPanel Grid.Row="2">
<my:DataGrid Name="dgResults" Margin="20" />
</DockPanel>
</Grid>
</Page>

What is the dock panel for in this example?
Try putting the DataGrid directly in the cell with no stackpanel. If you are setting the button height then set set grid to auto.
Also, why give so much space to the text?
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBox Height="170" Name="txtSQL" VerticalAlignment="Top" AcceptsReturn="True" TextWrapping="Wrap" Margin="20" Grid.Row="0"/>
<Button Content="Run!" Height="23" HorizontalAlignment="Left" Name="btnRun" VerticalAlignment="Top"
Margin="20,0,0,0" Width="75" Grid.Row="1" Click="btnRun_Click" />
<my:DataGrid Grid.Row="2" <my:DataGrid Name="dgResults" Margin="20" />
Then also set HorizontalAlignment, VerticleAlignment, HorizontalContentAlignment, and VerticalContentAlignment = stretch

Your Grid is drawn off screen without a scroll bar because you are using a StackPanel. Care must be taken when using StackPanel - it is the most simplistic of all WPF Panel derived classes since its MeasureOverride calls Measure for all of its children with a size of double.PositiveInifity regardless of how much space the panel actually has available. Even a ScrollViewer will not help you with a StackPanel (the ScrollBar will be shown, but you won't be able to move it).
For example, consider a Window 350 in height and width, and a single Button as its content which is 500 in both height and width:
<Window x:Class="WpfApplication2.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="350">
<StackPanel>
<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
<Button Content="Hello" Height="500" Width="500" />
</ScrollViewer>
</StackPanel>
</Window>
Similar to your example, the Button here is drawn off screen in both the vertical and horizontal directions and a non-functional scroll bar will be present. If we change the panel to one which respects the size of its given area (e.g. DockPanel):
<Window x:Class="WpfApplication2.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<DockPanel>
<ScrollViewer>
<Button Content="Hello" Height="500" />
</ScrollViewer>
</DockPanel>
</Window>
then scroll bars appear which are functional and hence allow the content off screen to be shown by scrolling.
Hope this helps!

What I have done was do define the horizontal and vertical alignments to "Stretch" respectively at the control you want (your DataGrid) to take up the size based on the window being resized.