I have created a ListViewTemplate as a UserControl,that I want to display it when I click on this Hamburger Button,this is my code:
Main.xaml:
<SplitView.Content >
<Grid Background="White" >
<Grid.RowDefinitions>
<RowDefinition Height="35" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid Grid.Row="0" Background="#f0f0f0" >
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
<Button x:Name="TrieButton" Margin="0" Content=""
Width="50" Background="Transparent" VerticalAlignment="Stretch" Click="TrieButton_Click" />
</StackPanel>
</Grid>
<Frame Grid.Row="1" x:Name="ContentFrame" Margin="0" />
</Grid>
</SplitView.Content>
And this is the code Behind:
Main.xaml.cs:
private void TrieButton_Click(object sender, RoutedEventArgs e)
{
ListViewTemplate c = new ListViewTemplate();
if (c.Visibility == Visibility.Visible)
{
c.Visibility = Visibility.Collapsed;
}
else
{
c.Visibility = Visibility.Visible;
}
}
this is my UserControl:
ListViewTemplate.xaml:
<Grid x:Name="FilterGrid" Background="Black">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Margin="0" >
<ListView x:Name="Liste" Background="Black" >
<ListViewItem >
<TextBlock Text="Nom" Foreground="#9d9e9e"/>
</ListViewItem>
<ListViewItem >
<TextBlock Text="Catégorie" Foreground="#9d9e9e"/>
</ListViewItem >
</ListView>
</StackPanel>
</Grid>
My problem is that this ListView UserControl is not shown when I click on the TrieButton,even I have increased the height of Grid
so please How can I correct my code,to have Listview showed when I click on TrieButton
thanks for help
Firstly: You didn't add the UserControl to your main XAML anywhere. You should add to XAML first like this:
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:usercontrol="clr-namespace:WpfApplication1"
Then:
<Grid Background="White" x:Name="MGrid">
<Grid.RowDefinitions>
<RowDefinition Height="35" />
<RowDefinition Height="10" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid Grid.Row="0" Background="#f0f0f0" >
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
<Button x:Name="TrieButton" Margin="0" Content=""
Width="50" Background="Transparent" VerticalAlignment="Stretch" Click="TrieButton_Click" />
</StackPanel>
</Grid>
<Frame Grid.Row="1" x:Name="ContentFrame" Margin="0" />
<usercontrol:ListViewTemplate x:Name="c" Grid.Row="2" Visibility="Collapsed"></usercontrol:ListViewTemplate>
</Grid>
Secondly: You just created a new instance of a ListViewTemplate. You should find one that is placed in your XAML by using FindName method and then change the Visibility of it like this:
private void TrieButton_Click(object sender, RoutedEventArgs e)
{
ListViewTemplate c = MGrid.FindName("c") as ListViewTemplate;
c.Visibility = c.Visibility == Visibility.Visible ? Visibility.Collapsed : Visibility.Visible;
}
In response to the button click you are incorrectly creating a new instance of a ListViewTemplate object and then throwing it away.
I think that what you really want to do is something along these lines:
private void TrieButton_Click(object sender, RoutedEventArgs e)
{
ListViewTemplate c = (ListViewTemplate) Controls["Liste"];
if (c.Visibility == Visibility.Visible)
c.Visibility = Visibility.Collapsed;
else
c.Visibility = Visibility.Visible;
}
Here we retrieve the existing Control and change its visible/collapsed state.
Related
I cant get the textbox inside my hub section
code xaml :
<Hub Header="Chutometro" x:Name="Hub" Margin="0,27,0,-1">
<HubSection Header="Números" x:Name="HbNumemro">
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBlock Text="De" Width="30" Height="30" FontSize="25" Margin="0,0,310,600"></TextBlock>
<TextBox x:Name="TxtN1" InputScope="Number" Height="40" MaxLength="15" Margin="0,30,0,0" ></TextBox>
<TextBlock Text="Á" Width="30" Height="30" FontSize="25" Margin="0,0,310,430"></TextBlock>
<TextBox x:Name="TxtN2" InputScope="Number" Height="40" MaxLength="15" Margin="0,110,0,0" ></TextBox>
<Button x:Name="BtN" Tapped="BtN_Tapped" Width="80" Height="80" Content="Okay" Margin="0,120,0,337"></Button>
<TextBlock x:Name="TxtBlockResult" FontSize="40" Height="80" Margin="0,280,0,269"></TextBlock>
</Grid>
</DataTemplate>
</HubSection>
<HubSection Header="Letras">
</HubSection>
</Hub>
C# :
string txtn1 = TxtN1.Text;
string txtn2 = TxtN2.Text;
I'm trying to get the x: name, but cant find
Because The HubSection contains a DataTemplate is not added directly to the visual tree, in order to get them:
private void Grid_Loaded(object sender, RoutedEventArgs e)
{
var textboxes = (sender as Grid).Children.OfType<TextBox>();
var TxtN1 = textboxes.First(p => p.Name == "TxtN1");
var TxtN2 = textboxes.First(p => p.Name == "TxtN2");
string k = "";
}
But I recommend you to use MVVM that will make things easy at long time.
I have the following xaml, where you can see a GroupBox on top and other ones on the left and on the right.
Is there a way to set the GroupBox on top so that (when I resize the window) its left and right edges are aligned respectively with the left edge of the GroupBoxes on the left and the right edge of the GroupBoxes on the right?
Edit
I'm keeping fixed the width of the groupboxes in the tab controls because I've implemented a wpf zooming there: I've updated the xaml now (of course the zoom is implemented also in the code behind)
<?xml version="1.0" encoding="utf-8"?>
<Window
x:Class="MatchWidth.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MatchWidth"
Height="1000"
Width="1600">
<Grid>
<Grid.RowDefinitions>
<RowDefinition
Height="100" />
<RowDefinition
Height="*" />
</Grid.RowDefinitions>
<GroupBox
Header="Top Box"
Grid.Row="0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Margin="25,5,35,25" />
<Grid
Grid.Row="1">
<Grid.LayoutTransform>
<ScaleTransform
CenterX="0" CenterY="0"
ScaleX="{Binding ElementName=uiScaleSliderL,Path=Value}"
ScaleY="{Binding ElementName=uiScaleSliderL,Path=Value}"/>
</Grid.LayoutTransform>
<Grid.ColumnDefinitions>
<ColumnDefinition
Width="*" />
<ColumnDefinition
Width="5" />
<ColumnDefinition
Width="*" />
</Grid.ColumnDefinitions>
<TabControl
Name="LeftTabCtr"
Grid.Column="0">
<TabItem Header="LeftTabCtr">
<ScrollViewer
HorizontalScrollBarVisibility="Auto">
<Grid
Height="800">
<Slider
x:Name="uiScaleSliderL"
ToolTip="Determines the UI scale factor."
Value="1" Minimum="0.1" Maximum="4" Width="200" Height="10"
HorizontalAlignment="Center" VerticalAlignment="Top" />
<GroupBox
Header="Left Box 1"
Grid.Column="0"
Grid.Row="0"
HorizontalAlignment="Stretch"
VerticalAlignment="Top"
Margin="25,20,25,25"
Width="720"
Height="180"/>
<GroupBox
Header="Left Box 2"
Grid.Column="0"
Grid.Row="0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Width="720"
Margin="25,220,25,10" />
</Grid>
</ScrollViewer>
</TabItem>
</TabControl>
<GridSplitter
Grid.Column="1"
Width="5"
HorizontalAlignment="Stretch" />
<TabControl
Name="RightTabCtr"
Grid.Column="2">
<TabItem Header="RightTabCtr">
<ScrollViewer
HorizontalScrollBarVisibility="Auto">
<Grid
Height="800"> <Slider
x:Name="uiScaleSliderR"
ToolTip="Determines the UI scale factor."
Value="1" Minimum="0.1" Maximum="4" Width="200" Height="10"
HorizontalAlignment="Center" VerticalAlignment="Top" />
<GroupBox
Header="Right Box 1"
Grid.Column="0"
Grid.Row="0"
HorizontalAlignment="Stretch"
VerticalAlignment="Top"
Margin="25,20,25,25"
Width="720"
Height="180"/>
<GroupBox
Header="Right Box 2"
Grid.Column="0"
Grid.Row="0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Width="720"
Margin="25,220,25,10" />
</Grid>
</ScrollViewer>
</TabItem>
</TabControl>
</Grid>
</Grid>
</Window>
The code behind contains something like that:
public partial class Window1 : Window
{
public Window1()
{
InitializeComponent();
uiScaleSliderL.MouseDoubleClick +=
new MouseButtonEventHandler(RestoreScalingFactorL);
}
protected override void OnPreviewMouseWheel(MouseWheelEventArgs args)
{
base.OnPreviewMouseWheel(args);
if (Keyboard.IsKeyDown(Key.LeftCtrl) ||
Keyboard.IsKeyDown(Key.RightCtrl))
{
uiScaleSliderL.Value += (args.Delta > 0) ? 0.1 : -0.1;
}
}
protected override void OnPreviewMouseDown(MouseButtonEventArgs args)
{
base.OnPreviewMouseDown(args);
if (Keyboard.IsKeyDown(Key.LeftCtrl) ||
Keyboard.IsKeyDown(Key.RightCtrl))
{
if (args.MiddleButton == MouseButtonState.Pressed)
{
RestoreScalingFactorL(uiScaleSliderL, args);
}
}
}
void RestoreScalingFactorL(object sender, MouseButtonEventArgs args)
{
((Slider)sender).Value = 1.0;
}
}
You must specify correct margins and remove constant widths of groupboxes (maybe in your case it will be more flexibile to use minWidth, or just remove it completely)
i have this code as follows
<Grid x:Name="LayoutRoot">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid x:Name="one" Grid.Row="0" Margin="49.667,15,15,15">
<Grid x:Name="container1" Background="Red" Margin="10"/>
<TextBlock Text="1" FontSize="65" Margin="228,10,260,27"/>
</Grid>
<Button Content="mov" x:Name="first0" Click="first_Click" Foreground="White" HorizontalAlignment="Left" Margin="13.333,27.833,0,0" Width="29.334" Background="Black" Height="32" VerticalAlignment="Top"/>
<Grid x:Name="due" Grid.Row="1" Background="black" Margin="49.667,15,15,15">
<Grid x:Name="container2" Margin="12,12,8,8" Background="#FF618F36"/>
<TextBlock Text="2" FontSize="65" Margin="228,10,198,27"/>
</Grid>
</Grid>
and the code behind:
private static T FindVisualChild<T>(DependencyObject parent) where T : DependencyObject
{
for (int i = 0; i < VisualTreeHelper.GetChildrenCount(parent); i++)
{
DependencyObject child = VisualTreeHelper.GetChild(parent, i);
if (child != null && child is T)
return (T)child;
else
{
T childOfChild = FindVisualChild<T>(child);
if (childOfChild != null)
return childOfChild;
}
}
return null;
}
private void first_Click(object sender, System.Windows.RoutedEventArgs e)
{
var first = FindVisualChild<Grid>(one);
var second = FindVisualChild<Grid>(due);
one.Children.Remove(first);
due.Children.Remove(second);
one.Children.Add(second);
due.Children.Add(first);
}
With this code i can move the "containers" in the Grid "one,due" but when i move the textblock disappear then i won't that ,because in future these grids will include others Grid,TextBox,textblock etc so kindly i ask you if there is a way to allow to move the containers including the childrens(textbox,textblock etc.)
Thank you in advance for the attention.
Sincerely
#Mark is right. The TextBlocks lie on top of your container grids, not inside them, which is why they don't move. Change your XAML to this, and it will work the way you expect:
...
<Grid x:Name="one" Grid.Row="0" Margin="49.667,15,15,15">
<Grid x:Name="container1" Background="Red" Margin="10">
<TextBlock Text="1" FontSize="65" Margin="228,10,260,27"/>
</Grid>
</Grid>
<Button ...
<Grid x:Name="due" Grid.Row="1" Background="black" Margin="49.667,15,15,15">
<Grid x:Name="container2" Margin="12,12,8,8" Background="#FF618F36">
<TextBlock Text="2" FontSize="65" Margin="228,10,198,27"/>
</Grid>
</Grid>
...
I've grid and button controls inside it.and what I want to get is row index and column index of clicked button .I'm new to silverlight so please help me
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="testgrid.MainPage"
Width="640" Height="480">
<Grid x:Name="LayoutRoot" Background="Azure" Height="400" Width="400" >
<Grid.ColumnDefinitions >
<ColumnDefinition Width="100*" />
<ColumnDefinition Width="100*" />
<ColumnDefinition Width="100*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="100*" />
<RowDefinition Height="100*" />
<RowDefinition Height="100*" />
</Grid.RowDefinitions>
<Button x:Name="button1" Grid.Column="0" Grid.Row="0" Click="grid_Item_Click">
<Image x:Name="img1" Source="/testgrid;component/Images/kobe_bryant1.jpg" Stretch="Uniform" ></Image>
</Button>
<Button x:Name="button2" Grid.Column="1" Grid.Row="0" Click="grid_Item_Click">
<Image x:Name="img2" Source="/testgrid;component/Images/kobe_bryant1.jpg" Stretch="Uniform" ></Image>
</Button>
<Button x:Name="button3" Grid.Column="2" Grid.Row="0" Click="grid_Item_Click">
<Image x:Name="img3" Source="/testgrid;component/Images/kobe_bryant1.jpg" Stretch="Uniform" ></Image>
</Button>
<Button x:Name="button4" Grid.Column="0" Grid.Row="1" Click="grid_Item_Click">
<Image x:Name="img4" Source="/testgrid;component/Images/kobe_bryant1.jpg" Stretch="Uniform" ></Image>
</Button>
</Grid>
</UserControl>
and its page behind i have
private void grid_Item_Click(object sender, RoutedEventArgs e)
{
}
You can try this
private void grid_Item_Click(object sender, RoutedEventArgs e)
{
Button btn = sender as Button;
int x=(int)btn.GetValue(Grid.RowProperty);
int y=(int)btn.GetValue(Grid.ColumnProperty);
MessageBox.Show("row"+x.ToString()+"column"+y.ToString());
}
I have two grids with three rows each. The first and last row of each grid has a fixed height while the middle rows have auto height and share their height using SharedSizeGroup.
First, the content of the right grid determines the height of the size group. When the content of the right grid shrinks so that the content of the left grid determines the height of the size group, the overall size of the left grid is not adjusted correctly.
See the following sample app. Click the increase button to increase the size of the textblock in the right grid. The size of the left grid changes accordingly. Now decrease the size. When the textblock becomes smaller than the textblock in the left grid, the total size of the left grid doesn't shrink. Is this a bug or am i missing something?
<StackPanel Orientation="Horizontal" Grid.IsSharedSizeScope="True">
<StackPanel Orientation="Vertical" Width="100">
<Grid Background="Green">
<Grid.RowDefinitions>
<RowDefinition Height="15" />
<RowDefinition SharedSizeGroup="Group1" />
<RowDefinition Height="15" />
</Grid.RowDefinitions>
<TextBlock Background="Blue" Grid.Row="0" />
<TextBlock Background="Red" Grid.Row="1" Name="textBlock1" Height="100" />
<TextBlock Background="Blue" Grid.Row="2" />
</Grid>
<TextBlock Text="{Binding Path=ActualHeight, ElementName=grid1}" />
</StackPanel>
<StackPanel Orientation="Vertical" Width="100">
<Grid Background="Green">
<Grid.RowDefinitions>
<RowDefinition Height="15" />
<RowDefinition SharedSizeGroup="Group1" />
<RowDefinition Height="15" />
</Grid.RowDefinitions>
<TextBlock Background="Blue" Grid.Row="0" />
<TextBlock Background="Red" Grid.Row="1" Name="textBlock2" Height="150" />
<TextBlock Background="Blue" Grid.Row="2" />
</Grid>
<TextBlock Text="{Binding Path=ActualHeight, ElementName=grid2}" />
</StackPanel>
<Button Height="24" Click="Button_Click_1" VerticalAlignment="Top">Increase</Button>
<Button Height="24" Click="Button_Click_2" VerticalAlignment="Top">Decrease</Button>
</StackPanel>
private void Button_Click_1(object sender, RoutedEventArgs e)
{
textBlock2.Height += 30;
}
private void Button_Click_2(object sender, RoutedEventArgs e)
{
textBlock2.Height -= 30;
}
The rows are staying the same height - the size of the second TextBlock is changing, while the size of the first TextBlock remains 100.
To demonstrate this, make the following changes:
Add ShowGridLines="True" to each of your Grids
Change your named TextBlocks to show their ActualHeight as their text:
<TextBlock Background="Red" Grid.Row="1" Name="textBlock2" Height="150"
Text="{Binding RelativeSource={RelativeSource Self}, Path=ActualHeight}"/>
You will see that the SharedSizeGroup row will be the maximum ActualHeight of the two TextBlocks.
Update: A Short Project To Show What's Happening
I've created a quick-n-dirty project to show what's happening. It turns out that when the right grid gets smaller than the original size, the left grid does an Arrange but not a Measure. I am not sure I understand this completely - I have posted a follow-up question with this same solution.
Here is the solution that I created, based on your original. It simply wraps the basic grid in a custom class that spews out info (via event) when Measure and Arrange are called. In the main window, I just put that info into a list box.
InfoGrid and InfoGridEventArgs classes
using System.Windows;
using System.Windows.Controls;
namespace GridMeasureExample
{
class InfoGrid : Grid
{
protected override Size ArrangeOverride(Size arrangeSize)
{
CallReportInfoEvent("Arrange");
return base.ArrangeOverride(arrangeSize);
}
protected override Size MeasureOverride(Size constraint)
{
CallReportInfoEvent("Measure");
return base.MeasureOverride(constraint);
}
public event EventHandler<InfoGridEventArgs> ReportInfo;
private void CallReportInfoEvent(string message)
{
if (ReportInfo != null)
ReportInfo(this, new InfoGridEventArgs(message));
}
}
public class InfoGridEventArgs : EventArgs
{
private InfoGridEventArgs()
{
}
public InfoGridEventArgs(string message)
{
this.TimeStamp = DateTime.Now;
this.Message = message;
}
public DateTime TimeStamp
{
get;
private set;
}
public String Message
{
get;
private set;
}
}
}
Main Window XAML
<Window x:Class="GridMeasureExample.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:GridMeasureExample"
Title="SharedSizeGroup" Height="500" Width="500">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<StackPanel Grid.Column="0"
Grid.Row="0"
Orientation="Horizontal"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Grid.IsSharedSizeScope="True">
<StackPanel Orientation="Vertical" Width="100">
<local:InfoGrid x:Name="grid1" Background="Green" ShowGridLines="True">
<Grid.RowDefinitions>
<RowDefinition Height="15" />
<RowDefinition SharedSizeGroup="Group1" />
<RowDefinition Height="15" />
</Grid.RowDefinitions>
<TextBlock Background="Blue" Grid.Row="0" Text="Row 0"/>
<TextBlock Background="Red" Grid.Row="1" Name="textBlock1" Height="100"
Text="{Binding RelativeSource={RelativeSource Self}, Path=ActualHeight}"/>
<TextBlock Background="Blue" Grid.Row="2" Text="Row 2" />
</local:InfoGrid>
<TextBlock Text="{Binding Path=ActualHeight, ElementName=grid1}" />
</StackPanel>
<StackPanel Orientation="Vertical" Width="100">
<local:InfoGrid x:Name="grid2" Background="Yellow" ShowGridLines="True">
<Grid.RowDefinitions>
<RowDefinition Height="15" />
<RowDefinition SharedSizeGroup="Group1" />
<RowDefinition Height="15" />
</Grid.RowDefinitions>
<TextBlock Background="Orange" Grid.Row="0" Text="Row 0" />
<TextBlock Background="Purple" Grid.Row="1" Name="textBlock2" Height="150"
Text="{Binding RelativeSource={RelativeSource Self}, Path=ActualHeight}"/>
<TextBlock Background="Orange" Grid.Row="2" Text="Row 2" />
</local:InfoGrid>
<TextBlock Text="{Binding Path=ActualHeight, ElementName=grid2}" />
</StackPanel>
</StackPanel>
<ListBox x:Name="lstInfo"
Grid.Column="1"
Grid.Row="0"
Margin="10,0,0,0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch" />
<UniformGrid Grid.Column="0"
Grid.Row="1"
Grid.ColumnSpan="2"
Columns="2"
HorizontalAlignment="Center"
Margin="5">
<Button x:Name="btnIncrease" Margin="4,0">Increase</Button>
<Button x:Name="btnDecrease" Margin="4,0">Decrease</Button>
</UniformGrid>
</Grid>
</Window>
Main Window Constructor (only code in code-behind)
public Window1()
{
InitializeComponent();
btnIncrease.Click += (s, e) =>
{
lstInfo.Items.Add(String.Format("{0} Increase Button Pressed", DateTime.Now.ToString("HH:mm:ss.ffff")));
textBlock2.Height += 30;
};
btnDecrease.Click += (s, e) =>
{
lstInfo.Items.Add(String.Format("{0} Decrease Button Pressed", DateTime.Now.ToString("HH:mm:ss.ffff")));
if (textBlock2.ActualHeight >= 30)
textBlock2.Height -= 30;
};
grid1.ReportInfo += (s, e) => lstInfo.Items.Add(String.Format("{0} Left Grid: {1}", e.TimeStamp.ToString("HH:mm:ss.ffff"), e.Message));
grid2.ReportInfo += (s, e) => lstInfo.Items.Add(String.Format("{0} Right Grid: {1}", e.TimeStamp.ToString("HH:mm:ss.ffff"), e.Message));
}