What markup is planned for UI Elements?

7 posts, 0 answers
  1. Marko
    Marko avatar
    5 posts
    Member since:
    May 2014

    Posted 27 Jun 2014 Link to this post

    Coming from a HTML5/CSS3/JS + PhoneGap background, I'm curious about what format the markup will be. Will it be more like XAML or HTML5?

    Or is it all going to be declarative/programatically like the sample cuteness app?
  2. Mike Graham
    Mike Graham avatar
    29 posts
    Member since:
    May 2010

    Posted 27 Jun 2014 in reply to Marko Link to this post

    I'd like to 2nd the question.  And add that i've been retraining myself from longtime XAML/C# guy to HTML5/CSS3/JS (really TypeScript) guy.
  3. Josh
    Josh avatar
    1 posts
    Member since:
    Sep 2013

    Posted 27 Jun 2014 Link to this post

    same question here, building the ui programmatically may give you control and reusability but it's certainly cumbersome. While I'm sure the answer is certainly something like "we do plan to do this of course" I guess my question would be is this something you're working on now to be the primary way to generate UI, or is it something that will be addressed at a later time, and when it is addressed, what is the most likely way you're envisioning it being done?

    many thanks!
  4. Valio
    Valio avatar
    102 posts
    Member since:
    Jun 2006

    Posted 27 Jun 2014 Link to this post

    Hi Mike and Marko,

    The short answer to this question is that we are currently evaluating the possible options. I really would like to get input from this group what would be the preferred/ideal option. We know how important this part of the framework is and we are approaching it very carefully. Our plan is to provide a declarative way for describe the UI, but it will not be based on HTML (for HTML we have KendoUI and PhoneGap).

    We are currently creating internal PoC apps and experimenting by creating core UI elements in JavaScript to be cross-platform. Things like Buttons, Labels, Pages are already implemented for iOS and Android and very soon I'll share the first concept before we start implementing them inside the framework.

    Our plan is to have full set of UI elements in JavaScript and in a declarative markup for v1 so that you do not need to write os-dependent UI code ( you will still be possible to write os-specific code if you like).
    Here is a list of controls we are considering to release with v1 (some will come earlier, some may not be available. Note that the list below is not a commitment - based on the feedback in this group it is likely to change.):

    Label
    Button
    Input box
    Listbox/Listview
    Combobox
    Checkbox
    Radiobutton
    Scrollviewer
    Application page
    Tab control
    Slider
    Progress bar
    Message box
    Password box
    Media element
    Context menu

    We do also plan to introduce layouts:

    Stack layout (horizontal, vertical)
    Absolute layout

    We are also thinking about Grid (table?) layout and Responsive Layout on a page level (similar to the popular adaptive layouts for web pages.)

    Any third party native libraries will also be supported out of the box for v1. If you have, for example, a favorite Charting library for iOS or Android you will be able to use it inside NativeScript.


    For v1 we will also have a Binding support and an MVC or MVVM-like approach for defining the UI layer. We want to be sure that with NativeScript you will be able to create clean and rich UI. Internally we are big fans of the XAML approach, but this is not so important - any suggestions will be carefully discussed. We want to appeal to JavaScript web developers and we are not sure how easy for them will be to consume XAML-based approach to describing the UI. Thoughts and feedback on this?

    An important note is that the current (horrible) code for defining the UI for the sample cutenss app is not the direction we are after. It is just the current state of the framework and developers will not need to write such code to implement the UI layer.

    I hope this gives you some direction for the UI layer. Do you like it? Thoughts? It is an important part of the framework and any ideas are more than welcome. Feel free to ask for specifics. 

    Best Regards,
    Valio Stoychev
    Technical Product Manager
    Telerik NativeScript


  5. Valio
    Valio avatar
    102 posts
    Member since:
    Jun 2006

    Posted 27 Jun 2014 in reply to Valio Link to this post

    @Mike - since you are writing Kendo and love Angular I think this new blog post will be interesting for you - http://developer.telerik.com/featured/announcing-support-for-kendo-ui-mobile-with-angularjs/

    For NativeScript - yes AngularJS support is on our radar as well as may other JS libraries. 

    Mike - can you please elaborate a little bit more about your "JSON markup data structure" ideas for building the UI markup? Do you have in mind a particular framework that is using this approach?

    -V
  6. Mike Graham
    Mike Graham avatar
    29 posts
    Member since:
    May 2010

    Posted 27 Jun 2014 in reply to Valio Link to this post

    Nice writeup, Valio :)

    Maybe a pure JSON "markup" data structure would be cool?

    We are building the first round of our HTML product on Kendo Mobile and I'm guessing the 2nd round will be based around Angular 2.  When you start digging into approaches for MVC / MVVM i think it would be worth following what those guys are up to.
  7. Ben Hayat
    Ben Hayat avatar
    892 posts
    Member since:
    May 2008

    Posted 27 Jun 2014 in reply to Valio Link to this post

    Hi Valio;

    The thread that I had opened a while back was specifically related to this question and thank you for covering it here. I would like to make a couple of comments:

    Here is a list of controls we are considering to
    release with v1 (some will come earlier, some may not be available. Note
    that the list below is not a commitment - based on the feedback in this
    group it is likely to change.):

    Label
    Button
    Input box
    Listbox/Listview
    Combobox
    Checkbox
    Radiobutton
    Scrollviewer
    Application page
    Tab control
    Slider
    Progress bar
    Message box
    Password box
    Media element
    Context menu


    My first comment is that, the team first should focus on the essential controls for getting data and showing data and triggering actions. These are the core that should be addressed first:

    List A:

    Input box
    Combobox
    Password box
    Label
    Listbox/Listview
    Button

    Once these are out
    List B:
    Tab control
    Menu
    Checkbox
    Radiobutton
    Scrollviewer
    Application page

    List C:
    Layout
    Stack layout (horizontal, vertical)
    Absolute layout

    List D:
    Slider
    Progress bar
    Message box
    Media element
    Context menu

    This way, we have the essentials to go forward. But if you give us a chart or progress bar or slider first, they are useless at this stage. :-)

    Secondly, I'm saying to build another "Expression Blend" like product, but eventually you will need a design tool for people design killer products. So many awesome Silverlight/WPF were designed in Expression Blend. So, that's a must have to design elegant apps.

    Hope this helps!

     

Back to Top