Giter Club home page Giter Club logo

x's Introduction

X.UI framework for Universal Apps

Quickly build rich UI's in your Universal Application ..

[IMPORTANT : This project depends on Windows SDK Anniversary Edition 14393]

Components still being fleshed out...

  • LiteTab
  • RichButton
  • Path
  • RichInput
  • EffectLayer
  • Chrome
  • RichTab
  • OneBox
  • RichScrollViewer
  • LiteDataGrid - A grid that lets you define several different DataTemplates and then alternate between them with a simple index value.
  • Viewer.* - Content is rendered by these viewers.
  • Toolbar
  • UserCard
  • ColorPicker
  • ZoomCanvas
  • APIKeys

The following components are less generic, possibly designed with the intention of modularizing the monolithic X.Browser app.

  • AddTab
  • MoreTab
  • Extensions.*
  • OneBox
  • ViewModels

The following components are reused across one or more components

  • CoreLib
  • Win32
  • Services.*
  • Extensions.*

The following components are created as Extensions using the "App Extensibility Framework" recently introduced into Windows 10 in unveiled at Build2016

These extensions will be built out over time, the advantage of having these be extensions is that they can deploy as part of the store and are more manageable .. like a consumer friendly nuget for your apps :)

  • AWS
  • Azure
  • Backgrounds
  • Facebook
  • Flickr
  • GitX
  • JsRTChakraCoreX
  • Office365
  • OneDriveX
  • Twitter

There are 2 demonstration applications that pull all the above components together

  • "X.Browser" .. Which is a demonstration browser application, that lets you browse web pages, media content, filesystem...
  • "X.Player" which is a more light weight, < 30MB footprint, that is used solely to load extensions and a single view (not multiple views in tabs which the browser does)

X.Browser 001

  • Below image shows how each tab can be "pinned" to the start menu and "docked" in the tab list on the left (like Edge)

lastrefreshed

  • Below video shows the startup time of a .NET Native compiled x64 version of the X.Browser app

.NET Native startup time

  • Below video shows how the extensions model works in the sample. Preparing for using the new extensions feature of the "aniversary" uwp application model

Third-party Extensions model

  • Below video shows the SketchFlow app(viewer), will be used to create extensions/plugins all in browser (like the F12 developer tool but for designers/developers)

SketchFlow Viewer

  • Below shows another sample HOST UWP app, X.Player, that loads 2 sample extensions Flickr/Twitter

lastrefreshed

  • Below shows the X.Browser Host UWP loading the same two extensions as X.Player (Twitter/Flickr)

lastrefreshed

Come chat with me on Twitter : https://twitter.com/josefajardo

x's People

Contributors

liquidboy avatar

Stargazers

 avatar Elchin Orujov avatar Ahmed Walid avatar  avatar Andrew Boyarshin avatar Jiang Lu avatar  avatar Yitzchok Gottlieb avatar Meteorsnows avatar  avatar  avatar Babken Gevorgyan avatar Emily Johnson avatar Ahmet avatar Chad Tolkien avatar Christian Ekoh avatar Tiago de Almeida Machado avatar Neil Camilleri avatar Anatolii Klots avatar Iannil avatar Adam Hill avatar Guillaume Pugnet avatar Freeman Open Technologies Team avatar Max Mayr avatar sk avatar  avatar Tamás Deme avatar

Watchers

 avatar James Cloos avatar Guillaume Pugnet avatar  avatar Moebeus avatar

x's Issues

enhancement : pick up where you left off

Implement caching and recovery so that when the browser dies or is shut down it picks up where you left off..

  • current loaded tabs and selected tab
  • scrollposition of selected tab
  • onebox filled in if applicable
  • anything that makes sense in the context of where the user is at the time of shutdown

Tabs : Pin a Tab create secondary tile

Pinning a tab
a. pinns the tab to the left of the tabarea showing only the favicon.
b. It will create a "secondary tile"
c. you create these from the "More Tab" by clicking on the 'Pin' icon

spelling mistake

You probably correct this file LiteTabSelectedThinknessConverter.cs

refactor : move images from Browser into MoreTab

i need to work out the correct uri for referencing the images from within MoreTab rather than having it sit in X.Browser\Assets

  • MissingImage.png

(these should ultimately sit in the X.UI.MoreTab.dll)

MoreTab : scrollbar not appearing when tabs overflow visible area

The scrollbar is not appearing when there are tabs that need to be reached and out of view..

  • May need to revisit the entire visual tree since adding "locked" / "normal tabs" .. as these 2 gridviews may be causing the scrollbars not correctly showing when applicable

multiple Process or AppDomain : each tab should be in it's own isolated process (child process) or appdomain

I want to achieve something similar to MSEdge or Chrome where each Tab get's it's own process of isolation (whatever that be)

The "parent" process has the main UI - Tablist and Shell.
Each Tab will ideally get it's own WebView and render itself in the "parent" processes relevant UI (tablist and WebViewContent)
The child process/appdomain needs to load its own webview's UI into the parent process
We need to overcome the UI thread rendering issue, hence why i believe we need to go down the Multi - AppDomain approach

Current approachs to research

a. out-of-process components
- https://code.msdn.microsoft.com/windowsapps/Creating-a-Windows-Runtime-ed84af9d

b. brokered components

c. Multiple AppDomains (links below recommend this)
- http://stackoverflow.com/questions/197182/windows-forms-application-like-google-chrome-with-multiple-processes/197264#197264
- http://stackoverflow.com/questions/628744/chrome-ie8-multi-process-design-is-it-possible-in-net
- http://dev.chromium.org/developers/design-documents
- http://pinvoke.net/default.aspx/user32/SetParent.html

d. the new "extensions" feature in the AppModel. Basically define multiple extensions as tabs, they are already running as AppX in there own AppDomain .. I still need to find out the UI Rendering story from an extension into the parent ...

extra links below :

Documentation below is msdn details on "Child Processes" :

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.