Introduction
I want to make the header button to be used to minimize items with a one click action, not double one
Screenshot of the header button
Source Code
StackPanel stackPanel = new StackPanel();
InitializeComponent();
NavigationView navigationView = new NavigationView();
navigationView.PaneDisplayMode = NavigationViewPaneDisplayMode.LeftMinimal;
navigationView.IsPaneOpen = false;
NavigationViewItem navigationViewItem = new NavigationViewItem();
void NavigationView(object sender, TappedRoutedEventArgs e)
{
navigationView.IsPaneOpen = true;
}
navigationViewItem.Icon = new SymbolIcon(Symbol.Admin);
navigationViewItem.Content = "Test";
navigationView.MenuItems.Add(navigationViewItem);
stackPanel.Children.Add(navigationView);
Content = stackPanel;
Problem
I want to run the code when the header button
clicked once, not twice, but I don't know how to change the source code to do that.
By testing, when clicking the header button, items are minimized. The default operation is once click. It works well.
In addition, why did you create UI through code behind? I suggest you could create it through xaml code.
For example:
<StackPanel>
<NavigationView PaneDisplayMode="LeftMinimal" IsPaneOpen="True">
<NavigationView.MenuItems >
<NavigationViewItem Content="Test" Icon="Admin" />
</NavigationView.MenuItems>
</NavigationView>
</StackPanel>
Related
I need to change the source of an Image control inside a gridview datatemplate when a click event is raised in uwp. When i click on a car image, this Image needs to be modified and displayed the brand logo. I succeed with that code:
<controls:AdaptiveGridView x:Name="AdaptiveGridViewControl"
animations:ReorderGridAnimation.Duration="350"
Margin="0,12,0,0"
ItemHeight="200"
DesiredWidth="200"
SelectionMode="Single"
IsItemClickEnabled="True"
ItemClick="GridView_ItemClick"
>
<controls:AdaptiveGridView.ItemTemplate>
<DataTemplate x:DataType="data:MyData">
<StackPanel Orientation="Horizontal">
<controls:ImageEx x:Name="ImageExControl"
MaxHeight="200"
IsCacheEnabled="True"
Source="{x:Bind carsPictures}"
Stretch="Fill"
PlaceholderSource="/Assets/placeholder_cover.jpg"
PlaceholderStretch="Uniform"/>
</StackPanel>
</DataTemplate>
</controls:AdaptiveGridView.ItemTemplate>
</controls:AdaptiveGridView>
Thanks to that post : How to access a Control inside the data template in C# Metro UI in the code behind,
i can use FindChildControl(DependencyObject control, string ctrlName) method.
In code behind:
private void GridView_ItemClick(object sender, ItemClickEventArgs e)
{
var newData = (MyData)e.ClickedItem;
ImageEx ex = FindChildControl<ImageEx>(this, "ImageExControl") as ImageEx;
ex.Source = newData.brandLogo;
}
The problem is this gridview contains 30 cars picture and only the first Image control is modified when a click event is raised. I don't know how to use the AdaptiveGridView.SelectedItem to change the clicked Image control.
You need to Get GridViewItem that has been Clicked so that you can change the image of the Clicked Item. Change your ItemClick Event to something like below.
private void GridView_ItemClick(object sender, ItemClickEventArgs e)
{
GridViewItem item = myGridView.ContainerFromItem(e.ClickedItem) as GridViewItem;
MyData newData = (MyData)e.ClickedItem;
ImageEx ex = FindChildControl<ImageEx>(item, "ImageExControl") as ImageEx;
ex.Source = newData.brandLogo;
}
Hope This Helps.
How can I enlarge image in C# (exactly in UWP) after clicking on it?
I tried few things:
1) I tried to add button, with image content, what I want to enlarge, and then I added event Click. But I don't know what I should to add into that code.
2) i also tried to add image directly to my XAML page, and I wanted to create Tapped event, but again, I don't know what I should to add into that code.
I just want to create a small photogallery, so after clicking on image thumbnail will be opened larger image.
Or if there is any possibility to add pdf files, you can write it too. That's another solution of my problem.
You could enlarge the Image by settings its RenderTransform property to a ScaleTransform:
private void Image_Tapped(object sender, TappedRoutedEventArgs e)
{
Image image = sender as Image;
image.RenderTransform = new ScaleTransform() { ScaleX = 2, ScaleY = 2 };
}
<Image Source="ms-appx:///Assets/pic.png" Tapped="Image_Tapped" Stretch="None" />
The ScaleX and ScaleY properties gets or sets the scaling factor. Please refer to the MSDN documentation for more information: https://msdn.microsoft.com/library/windows/apps/br242940?f=255&MSPPError=-2147217396
Looks good, but there is a problem. When I add more images, like into GridView, they are overlapping, and highlighted. Images can overlap, but image, which I click should be always on top...
You could put the tapped Image in a Popup then and then for example add it back to its original Panel when it is tapped again. I put together an example that should give you the idea and something to build on:
private void Image_Tapped(object sender, TappedRoutedEventArgs e)
{
Image image = sender as Image;
Panel parent = image.Parent as Panel;
if (parent != null)
{
image.RenderTransform = new ScaleTransform() { ScaleX = 2, ScaleY = 2 };
parent.Children.Remove(image);
parent.Children.Add(new Popup() { Child = image, IsOpen = true, Tag = parent });
}
else
{
Popup popup = image.Parent as Popup;
popup.Child = null;
Panel panel = popup.Tag as Panel;
image.RenderTransform = null;
panel.Children.Add(image);
}
}
<GridView SelectionMode="None" isItemClickEnabled="True">
<GridView.ItemTemplate>
<DataTemplate>
<Grid>
<Image Source="ms-appx:///Assets/pic.png" Tapped="Image_Tapped" Stretch="None" />
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
Imagine next situation: I do have application window with several usercontrols inside. They was displayed side by side in past, but now I want to show one of them in popup window. Not in Popup control but new Window.
See example XAML:
<Window x:Class="WpfApplication3.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:wpfApplication3="clr-namespace:WpfApplication3"
Title="MainWindow"
Height="350"
Width="525">
<Grid>
<wpfApplication3:UserControl1 Visibility="Hidden"
x:Name="UserControl1"/>
<Button Click="ButtonBase_OnClick"
Width="100"
Height="60">open window</Button>
</Grid>
In code behind I need to deattach usercontrol from current Window and assign to new one:
private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
var parent = VisualTreeHelper.GetParent(UserControl1);
if (parent != null)
{
parent.RemoveChild(UserControl1);
}
var w = new Window
{
Content = UserControl1,
Title = "sample",
SizeToContent = SizeToContent.WidthAndHeight,
ResizeMode = ResizeMode.CanResize
};
w.Show();
}
And after calling w.Show() I always getting blank white window.
If in button click handler change
Content = UserControl1
to
Content = new UserControl1()
I will get right content as well.
But I can't use this way because I want to keep my usercontrol state during pop-out and pop-in events.
So how can I show in new window existing usercontrol without recreating it?
I am not sure how you are calling RemoveChild on a DependencyObject as that method doesn't seem to exist. Note that VisualTreeHelper.GetParent returns a DependencyObject so, the code you posted should not compile unless you have an Extension method somewhere defining RemoveChild.
In your case what you want to do is cast your parent object to type Grid or Panel and then remove the UserControl from the Children property, then set your UserControl as the Content of your window.
private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
Grid parent = VisualTreeHelper.GetParent(UserControl1) as Grid;
if (parent != null)
{
parent.Children.Remove(UserControl1);
}
var w = new Window
{
Content = UserControl1,
Title = "sample",
SizeToContent = SizeToContent.WidthAndHeight,
ResizeMode = ResizeMode.CanResize
};
w.Show();
}
There was a similar question asked here
that gives a very detailed answer.
The quick answer is that you will have to remove the control from the main window and then add it to the popup window.
In my main page I try to show a list of stuff, and on this stuff a userControl as an overlay. In fact I never see it. (In the design view, my userControl is oaky)
XAML MainPage
<Grid>
<Grid x:name="MyPage">
<!-- All this part is visible -->
//Button
//Button
//nice Pic
//Button
</Grid>
<cat:CatPagecontrol x:Name="CatTool" Visibility="Visible" HorizontalAlignment="Center" VerticalAlignment="Center">
<cat:CatPagecontrol.Transitions>
<TransitionCollection>
<PopupThemeTransition/>
</TransitionCollection>
</cat:CatPagecontrol.Transitions>
</cat:CatPagecontrol>
<!-- EDIT I remove the Grid "CatGrid" And the ZIndex -->
</Grid>
I try to switch the ZIndex, no results.
C# File
public MainView()
{
this.CatTool = new CatPagecontrol();
//this.CatTool.Visibility = Visibility.Collapsed;
}
private void showCatSelector()
{
this.CatTool.Visibility = Visibility.Visible;
}
After that I need that one of my buttons show the overlay when clicked.
If you know how to show it, I'm yours. Thanks.
edit : solution find.
Voila !
I've find my problem :
public CatPagecontrol()
{
this.InitializeComponent();
}
I just Initialized in the correct section.
I have such xaml code:
<Grid x:Name="boardGrid">
<Grid.ContextMenu>
<ContextMenu Opacity="0.7" x:Name="menuContext">
</ContextMenu>
</Grid.ContextMenu>
</Grid>
I generate grid's items in code behind. What I want is to disable context menu opening on right click. I want to open it when certains conditions occur.
This is what I have in .cs file:
generating Unit's objects and putting them into Grid;
each object has unit.MouseRightButtonUp += unit_MouseRightButton
void unit_MouseRightButtonUp(object sender, MouseButtonEventArgs e)
{
if (CurrentGame.CurrentPlayer.HasTurn == false) return;
.....
ContextMenu.IsOpen = true;
}
So it means that Contextmenu should be open only if condition is fulfilled but it opens anyway.
You can set the attached property ContextMenuService.IsEnabled to false. Then you can manually popup the ContextMenu.
You must set that property for the GUI element that owns the menu. Setting it for the menu itself will do nothing.
<Grid x:Name="boardGrid" ContextMenuService.IsEnabled="false">
<!-- ... -->
</Grid>
void unit_MouseRightButtonUp(object sender, MouseButtonEventArgs e) {
if (CurrentGame.CurrentPlayer.HasTurn == false) return;
.....
boardGrid.ContextMenu.IsOpen = true;
}