How to take click on action bar icon in xamarin.forms? - xaml

I added the Notification icon on action bar. I want to take clicked on it. So how can i do this? Anyone knows please revert back with answer.

If you added a toolbar item you can do it like this:
ToolbarItems.Add(new ToolbarItem("Action Name", "Icon.png", async () =>
{
//Your code on clicked
}));
To do it in Xaml, you need to add the command attribute:
<ContentPage.ToolbarItems>
<ToolbarItem Name="Invite" Command="{Binding ToolbarItemCommand}"></ToolbarItem>
</ContentPage.ToolbarItems>
Then in your code behind define an ICommand named ToolbarItemCommand which will be triggered when the icon is clicked

Related

uwp NavigationView control Titlebar

I have a problem with the NavigationView Control and the titlebar.
I have tried to extend the view into the titlebar to play with the acrylic effects of the standard NavigationView. But then I´ve noticed that the back and menu buttons are underneath the titlebar, so you´re not able to click them properly.
In the attached image, you can see that everything under the red line is clickable but when you go over it, you are targeting the titlebar.
Is there anything I can do to fix this behavior?
I don't know which version OS you are working on, I didn't see this problem in recent Windows insider OS.
You may workaround the not clickable problem by set a dummy Titlebar like below:
<Grid>
<Grid x:Name="AppTitleBar" Background="Transparent" />
<NavigationView IsBackEnabled="True" PaneDisplayMode="Top">
<NavigationView.MenuItems>
<NavigationViewItem Icon="Accept" Content="Accept" />
</NavigationView.MenuItems>
</NavigationView>
</Grid>
public MainPage()
{
this.InitializeComponent();
var coreTitleBar = CoreApplication.GetCurrentView().TitleBar;
coreTitleBar.ExtendViewIntoTitleBar = true;
Window.Current.SetTitleBar(AppTitleBar);
}

How to show navigation page button on all views Xamarin Forms

I am working with Xamarin Forms and I am using MasterDetailPage and NavigationPage and everything is working. Now, I need to configure the page button (three bars on the left) to be visible on all views.
I have a MasterDetailPage with a menu and the user clicks a menu its navigate to other pages. First page (homepage) look like that:
<MasterDetailPage.Detail>
<NavigationPage>
<x:Arguments>
<home:HomePage />
</x:Arguments>
</NavigationPage>
</MasterDetailPage.Detail>
When the user clicks in menu inside masterdetailpage or other menus outside masterdetailpage it performs a navigation:
The three bars page button is visible only on the first view, when I navigate to others views, that button disapears.
But, I want something like that:
The page back button showns automatically when i navigate to other pages and it's fine.
How to let the three bars page button visible to all views and maintain the back page button?
I am using the following code to navigate between views:
await Navigation.PushAsync(MyNewPage());
Thanks!
Your master detail page has to handle the navigation to the detail pages for it to work correctly.
Connect the menu listview:
ListView.ItemSelected += OnItemSelected;
In the OnItemSelected event.
{MasterDetailPage}.Detail.Navigation.PushAsync(new MyNewPage());
Here is an example of master detail navigation:
async void OnItemSelected(object sender, SelectedItemChangedEventArgs e)
{
var item = e.SelectedItem as MasterPageItem;
if (item != null)
{
NavigationPage nextDetailPage = null;
await Task.Run(() =>
{
nextDetailPage = new NavigationPage((Page)Activator.CreateInstance(item.TargetType));
});
Detail = nextDetailPage;
masterPage.ListView.SelectedItem = null;
IsPresented = false;
}
}
This is not possible, as you can't have two buttons on the left side. And as many applications I have seen, no app supports this kind of UI. Unless you write custom navigation bar and put it on top of every page.
You can create a stack of detail pages in your main MasterDetailPage. So whenever you want to push a new page, instead you can just set page as Detail and put old Detail in your own stack.
For Android you can wrap back button event to pop page from stack, but on iOS there is no back button, so you will have to create some sort of back button in detail page's toolbar.
I think that you will have to write a Custom Renderer to achieve what you want.
But if you want only to keep the hamburger button, without the back button, you can navigate to your pages using this code:
Detail = new NavigationPage(new MyNewPage());

How to call another page using Tap Gesture in Xamarin.Forms?

I created an Image Button and put a Tap Gesture into it. I want my Image Button to call another Page but I don't know how am I going to do that without using Navigation.PushAsync but it's causing me this error "PushAsync is not supported globally on Android, please use a Navigation Page."
This is my XAML code.
<Image Source="add.jpg">
<Image.GestureRecognizers>
<TapGestureRecognizer
Tapped="TapGestureRecognizer_OnTapped"
NumberOfTapsRequired="1" />
</Image.GestureRecognizers>
</Image>
and this is my XAML.CS code.
private void TapGestureRecognizer_OnTapped(SecondPage secondPage)
{
Navigation.PushAsync(new SecondPage());
}
If you need to use PushAsync, the parent Page should be a NavigationPage.When we use NavigationPage and do PushAsync the Navigation stack will be maintained and you will get a back button in Actionbar for back navigation.
Rather if we use PushModalAsync, the page will be presented modally.
Changing PushAsync to PushModalAsync will work.
private void TapGestureRecognizer_OnTapped(SecondPage secondPage)
{
Navigation. PushModalAsync(new SecondPage());
}

Navigate to the last frame from SwapChainBackgroundPanel

I am writing a Windows Store app using C++/XAML with DirectX interop - SwapChainBackgroundPanel.
The application is based on the template "Split Page". From each list view item, a DirectX page may be launched using code below.
Window::Current->Content = ref new MyD3Components::DirectXPage();
Window::Current->Activate();
This is working fine and DirectX page opens up and plays very well.
What I would like to have a button in the app bar which helps user to go back and display the "Split Page" to allow selecting another DirectX page. This I have not been able to accomplish yet.
Among several things I have tried, below is the most logical one to my opinion. It gives a "Platform::DisconnectedException" when user wants to go back to the last page.
Windows::UI::Xaml::Controls::Frame^ rootFrame = SDL::App::GetRootFrame();
Window::Current->Content = rootFrame;
Window::Current->Activate();
Please look to see if you have a suggestion or better a solution.
Here the sample example for your question :
What i am creating : 2 pages...
You will have (go to page 2)link on page 1...If u click that,the second page should appear that says "Page 2" at the top. Notice that there is a back button to the left of the page title. Click the button to return to the first page...
1.) Find the TextBlock element named pageTitle and change the Text property to Page 1. The XAML should look like this:
<TextBlock x:Name="pageTitle" Grid.Column="1" Text="Page 1"
Style="{StaticResource PageHeaderTextStyle}"/>
2.)Add the following XAML as a second child element to the root Grid. The StackPanel element should be a sibling to the Grid that contains the back button and page title.
<StackPanel Grid.Row="1"
Margin="120,0,120,60">
<HyperlinkButton Content="Click to go to page 2" Click="HyperlinkButton_Click_1"/>
</StackPanel>
3.)Make the following changes to BasicPage2.xaml.
Find the TextBlock element named pageTitle and change the Text property to Page 2. The XAML should look like this:
<TextBlock x:Name="pageTitle" Grid.Column="1" Text="Page 2"
Style="{StaticResource PageHeaderTextStyle}"/>
4.)Add the following XAML as a second child element to the root Grid. The StackPanel element should be a sibling to the Grid that contains the back button and page title.
<StackPanel Grid.Row="1"
Margin="120,0,120,60">
<TextBlock HorizontalAlignment="Left" Name="tb1" Text="Hello World!"/>
</StackPanel>
5.)Add the following code to the BasicPage1 class in BasicPage1.Xaml.cs
private void HyperlinkButton_Click_1(object sender, RoutedEventArgs e)
{
this.Frame.Navigate(typeof(BasicPage2));
}
6.)Now that we've prepared the new pages, we need to make BasicPage1 the first thing that appears when the app starts. Open app.xaml.cs and change the OnLaunched method to call Frame.Navigate by using BasicPage1 instead of the BlankPage. The entire OnLaunched method should look like the following:
protected override void OnLaunched(LaunchActivatedEventArgs args)
{
// Create a Frame to act navigation context and navigate to the first page
var rootFrame = new Frame();
rootFrame.Navigate(typeof(BasicPage1));
// Place the frame in the current window and ensure that it is active
Window.Current.Content = rootFrame;
Window.Current.Activate();
}
Now you are ready to test the app. Start the app, and click the link that says Click to go to page 2. The second page should appear that says "Page 2" at the top. Notice that there is a back button to the left of the page title. Click the button to return to the first page.
Thats it! hope it helps u.
After a bit of trial and error, I am in the position to answer my own question. It seems that all I needed to do was to remove my rendering callbackfrom the CompositionTarget.
It was added like below.
m_eventToken = CompositionTarget::Rendering::add(ref new Windows::Foundation::EventHandler<Object^>(this, &DirectXPage::OnRendering));
Before replacing the current window and activating it, I called below.
CompositionTarget::Rendering::remove(m_eventToken);
I guessed this helped DirectX not to output to rendering pipeline and complain (disconnectedexception) when the target is not there.

How do you utilize the flipview and make a "selection" by tapping or clicking the screen?

In Win 8, the flipview control is a great control to browse the collection. But how or what is the best way to make a "selection" with a tap or a mouse click? I can always put a button outside of the flip view, but that's not the touch experience that everyone of a tablet would expect.
can someone give some example code (XAML/C#) of how to setup a flipview control with a selection of some sort that would navigate to a totally different page?
I wrote some sample code that works, if I'm understanding the question correctly. I am able to swipe through the FlipView and tap the individual item:
<FlipView Tapped="FlipView_Tapped_1">
<Image Source="Images/Apple.jpg" />
<Image Source="Images/Orange.jpg" />
<Image Source="Images/Banana.jpg" />
</FlipView>
And then
private YourTypeHere SelectedItem;
private void FlipView_Tapped_1(object sender, TappedRoutedEventArgs e)
{
this.SelectedItem = (sender as FlipView).SelectedItem;
}
You might not want to set a field, but you get the idea. Hopefully, you will be setting something in your view model. From there you can nav away or anything you need. A FlipView inherits from ItemsControl just like every other XAML repeater. So you can treat it exactly the same. http://msdn.microsoft.com/en-us/library/system.windows.controls.itemscontrol.aspx