Comments (13)
@viniciusou Below is the class I currently use.
Example:
var masterDetail = new ThemedMasterDetailNavigationContainer();
masterDetail.Init("Menu", "slideout.png");
masterDetail.AddPageWithIcon<MyViewModel>("Home", "slideout.png");
public class MenuItem
{
public string Title { get; set; }
public string IconSource { get; set; }
}
public class ThemedMasterDetailNavigationContainer : FreshMasterDetailNavigationContainer
{
List<Models.MenuItem> pageIcons = new List<Models.MenuItem>();
public void AddPageWithIcon<T> (string title, string icon = "", object data = null) where T: FreshBasePageModel
{
base.AddPage<T>(title, data);
pageIcons.Add(new Models.MenuItem
{
Title = title,
IconSource = icon
});
}
protected override void CreateMenuPage(string menuPageTitle, string menuIcon = null)
{
var listview = new ListView();
var _menuPage = new ContentPage();
_menuPage.Title = menuPageTitle;
_menuPage.BackgroundColor = Color.FromHex("#c8c8c8");
listview.ItemsSource = pageIcons;
var cell = new DataTemplate(typeof(ImageCell));
cell.SetValue(TextCell.TextColorProperty, Color.Black);
cell.SetBinding(ImageCell.TextProperty, "Title");
cell.SetBinding(ImageCell.ImageSourceProperty, "IconSource");
listview.ItemTemplate = cell;
listview.ItemSelected += (sender, args) =>
{
if (Pages.ContainsKey(((Models.MenuItem)args.SelectedItem).Title))
{
Detail = Pages[((Models.MenuItem)args.SelectedItem).Title];
}
IsPresented = false;
};
_menuPage.Content = listview;
var navPage = new NavigationPage(_menuPage) { Title = "Menu" };
if (!string.IsNullOrEmpty(menuIcon))
navPage.Icon = menuIcon;
Master = navPage;
}
protected override Page CreateContainerPage(Page page)
{
var navigation = new NavigationPage(page);
navigation.BarTextColor = Color.White;
return navigation;
}
}
from freshmvvm.
Thank you @rid00z , I will follow your advice. I'm trying to implement menu icons on a MasterDetailContainer using Material Design pattern.
I watched your n+ videos and they were really helpful. Great work done on FreshMvvm!
from freshmvvm.
You could extend the class with a bindable property to support databinding like this
public static readonly BindableProperty ItemTemplateSelctorProperty =
BindableProperty.Create (nameof (MenuItemItemTemplate), typeof (DataTemplate), typeof (StyledMDContainer), default (DataTemplate));
from freshmvvm.
Current FreshMasterDetailNavigationContainer implementation use page names only and there is no easy way to add icons there. Of course you may override CreateMenuPage for Main page initialisation and create new AddPage method with icon parameter, but I would recommend just to create a custom navigation container. Fortunately with FreshMvvm this is super easy. You may use FreshMasterDetailNavigationContainer source code as a reference.
from freshmvvm.
The source code uses some internal members. I ended up just overriding those two methods. Is it possible for this capability to be added?
from freshmvvm.
Yes, FreshBasePageModel.CurrentNavigationServiceName is an internal string (which is set in FreshMasterDetailNavigationContainer.AddPage).
Unfortunately, it's not accessible when creating an own NavigationContainer.
Can you please make it public / wrap a settable property around it?
Thanks.
from freshmvvm.
Hello @allenmoatallen, I had the same question when started to work with MasterDetailContainer these days. Could you share which approach have you used to get menu item icons supported in a MasterDetailContainer? Thanks.
from freshmvvm.
Hi All
If you inherit from FreshMasterDetailNavigationContainer then you'll be able to implement any MasterPage that you would like. You can also look at the container for a reference to completely do your own.
I'm planning to do some more videos on more advanced navigation in FreshMvvm. Just need to find the time.
from freshmvvm.
Hi all
I'm planning to do some more videos on more advanced navigation in FreshMvvm. Just need to find the time.
Please find :)
Thanks
from freshmvvm.
Awesome @allenmoatallen,
I've tested and adapted the code to my sample app and it's working perfectly!
Thanks a lot.
from freshmvvm.
Glad I could help!
from freshmvvm.
Great example @allenmoatallen . Is override still the way to go i you want to customize style like colors and fonts?
from freshmvvm.
@allenmoatallen thanks for that. it works fine but when I extend this using viewcell with some grid layout inside viewcell, I am able to extend as I want. Only problem I have is when I select and item from the list, it causes a small flash on the screen and navigates to the page and hides side bar. Has anybody experienced something like that? maybe it is because my layout became so heavy or side bar is too fast disappears.
from freshmvvm.
Related Issues (20)
- CoreMethods PopPageModel() throws exception when page contains CarouselView HOT 1
- using <Path> in XAML throws TinyIoCResolutionException
- ReverseInit not called HOT 1
- XF 5 MasterDetailPage to FlyoutPage HOT 1
- Correct way to handle Button Clicks and updating the model HOT 1
- Hamburger Menu is displayed in the Content Page in Landscape Orientation - Android HOT 1
- Project status and plans for .NET MAUI HOT 10
- Page not loaded properly for PopPageModel using navigation stack in FreshMVVM Xamarin Forms Android HOT 1
- SetBackButtonTextProperty doesn't work HOT 1
- How to intercept software back button press on FreshMVVM PageModel? HOT 3
- v4.0 Release notes?
- SIGABRT: Popped page does not appear on top of current navigation stack, please file a bug. IOS Xamarin HOT 2
- Can not run sample App in VS2019
- Fody Propertychanged on Viewmodels
- PushPageModel does not work after the app ran in the background
- Implement same bevaviour as at PRISM IDestructible HOT 4
- Update view after update bind property in ViewModel
- Cannot resolve IFreshNavigationService from a page loaded from Notifcation tap HOT 1
- FreshMVVM MAUI support
- Issue 'NavGraph cannot be null' with FreshMasterDetailNavigationContainer since MAUI 8
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from freshmvvm.