Windowscommunitytoolkit: Tab control like in Microsoft Edge

[Odonno]

It can happen that sometimes we do need a control to store a list of pages/elements that looks like a Pivot control but with a infinite list of pages/elements. So, I think the tab (header) control of Microsoft Edge can be reused with :

• [ ] A list of default templates
  
  
  
  • example 1 : only title
  
  
  • example 2 : icon with title
  
  
  • example 3 : icon with title and a close button (like Microsoft Edge)
  
  
• [ ] A close button (like Microsoft Edge)
• [ ] A preview template (for previewing content tab like a small window)
• [ ] A plus button to add more elements (like Microsoft Edge)
• [ ] Ability to set ItemTemplateSelector so we can for example create one template for focused items and another for unfocused items

Linked to https://wpdev.uservoice.com/forums/110705-universal-windows-platform/suggestions/17983933-tab-control-like-in-microsoft-edge

[hawkerm]

It'd be great if this type of control also automatically allowed/handled ripping out a tab into it's own new window view like Edge (and most browsers) as well.

[Odonno]

@hawkerm It is not what I intended to create. The first goal will be to offer the minimum experience of multiple tabs like we can use in a browser or some apps that use this control.

But if more interested features can come from this control, I am 100% OK to do it.

[hawkerm]

@Odonno of course, minimal viable product first. :)

Just wanted to add that in for future tracking as it's a scenario that'd add a lot of depths to apps if it could be generalized, as I know it's probably not a trivial add-on.

[Pinox]

This is probably one of the biggest disadvantages of UWP apps over browser tabs. Users like to open articles / pictures in different tabs and although I understand there is a native api for tabs in UWP it's not often used in desktop UWP apps. One of the reasons many people prefer websites over native apps is exactly this feature especially on the desktop.

would be great to see this feature in this toolkit , I see twitter also thinks so.

[Odonno]

@Pinox Yeah. Definitely. I heard that Microsoft teams are working to add a native Tabbed control to UWP apps. So, maybe we only have to wait to be able to use it.

Otherwise, I do not have time to work on this control. If someone feels brave and have time, just do it.

[Vijay-Nirmal]

What about a Tab Control that can be used as Tabs in OneNote(Home, Insert, Draw, ...) or Tabs in Edge? #353

[Odonno]

@Vijay-Nirmal This issue is about Tabs like in Microsoft Edge. I am open to other forms of tabs but my idea was to follow some sort of "official" UI controls.

The thing with OneNote Tabs is that they are related to Office UI design which looks good but in my opinion it does not offer a lot of reusability as a base control. That's why I am currently waiting for a UI control exactly like you can see in Edge.

[Vijay-Nirmal]

@Odonno I didn't talk about the design I talk about the feature. My idea is to create a control to be used like Tabs in OneNote(Without the close button) or Tabs in Microsoft Edge(With the close button) by just setting IsCloseButtonVisible. If you like the design of the Tabs in Microsoft Edge then let it be. Then there will be a single Tab control that can be used in Multiple Cases.

Also, If there is an option to set OnFocusTabBackground and OffFocusTabBackground then if we set white and purple respectively then it would look like OneNote.

[Odonno]

@Vijay-Nirmal Please check my first comment. Let me know if something is missing.

[Vijay-Nirmal]

@Odonno Sorry, I missed the default template part. What about 'OnFocusTabBackground'(also 'OffFocusTabBackground') and 'OnFocusTabForeground' ('OffFocusTabForeground')?

[Odonno]

@Vijay-Nirmal I am not sure how these templates can interact with the ItemTemplateSelector. What about SelectedItemTemplate?

[Vijay-Nirmal]

@Odonno SelectedItemTemplate look good to me. Is there is any method to use "previewing content tab like a small window" without using multiple threads? Close Button won't be easy to tap in touch screen it would be nice if we integrate some gestures control to control the tabs like swipe up to close, swipe down to show preview, etc

[mdtauk]

Edge Tabs, Office Tabs, it should just be TabBar, with templates to choose the design of the Bar and the TabItems, and the control has an event that is triggered when changing tabs, which can be used to control a frame containing toolbars, or content.

[nmetulev]

Closing as duplicate of #353