56 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has collected 1+ items on Envato Market
  • Located in United Kingdom
+4 more
JMDDesigns says

I’ve been very curious lately about the development of Windows 8 Apps. I’m not sure if they fall in to the same principles as iOS development, but they have similar licensing schemes. I know a few devs on here make apps for iOS then sell them on, or make templates for game development etc., but when will we be able to do the same for W8 Apps? I find them awesome to design & develop, plus I see a lot of potential in it. You are required to have a developers license like Apple Developers using Xcode, so I was wondering if developers for W8 Apps could sell their templates/designs/apps through CodeCanyon in the near future?

I mean, people with HTML /CSS/jQuery experience will find it a hell of a lot easier to develop these apps (presuming you are using or have Windows 8 ), they are built purely on HTML , CSS and JavaScript libraries.

I presume it could be down to licensing with MS, but I’m not exactly sure.

Any staff members know anything about the future of selling W8 Apps and so on?

This is how the “First” page looks like from the start in HTML :

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>App1</title>

    <!-- WinJS references -->
    <link href="//Microsoft.WinJS.1.0/css/ui-dark.css" rel="stylesheet" />
    <script src="//Microsoft.WinJS.1.0/js/base.js"></script>
    <script src="//Microsoft.WinJS.1.0/js/ui.js"></script>

    <!-- App1 references -->
    <link href="/css/default.css" rel="stylesheet" />
    <script src="/js/data.js"></script>
    <script src="/js/navigator.js"></script>
    <script src="/js/default.js"></script>
</head>

<body>
    <div id="contenthost" data-win-control="Application.PageControlNavigator" data-win-options="{home: '/pages/groupedItems/groupedItems.html'}" />
    <!-- <div id="appbar" data-win-control="WinJS.UI.AppBar">
        <button data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'cmd', label:'Command', icon:'placeholder'}" type="button"></button>
    </div> -->
</body>
</html>

And here is the CSS from standard:

#contenthost {
    height: 100%;
    width: 100%;
}

.fragment {
    /* Define a grid with rows for a banner and a body */
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 128px 1fr;
    display: -ms-grid;
    height: 100%;
    width: 100%;
}

    .fragment header[role=banner] {
        /* Define a grid with columns for the back button and page title. */
        -ms-grid-columns: 120px 1fr;
        -ms-grid-rows: 1fr;
        display: -ms-grid;
    }

        .fragment header[role=banner] .win-backbutton {
            margin-left: 39px;
            margin-top: 59px;
        }

        .fragment header[role=banner] .titlearea {
            -ms-grid-column: 2;
            margin-top: 37px;
        }

            .fragment header[role=banner] .titlearea .pagetitle {
                width: calc(100% - 20px);
            }

    .fragment section[role=main] {
        -ms-grid-row: 2;
        height: 100%;
        width: 100%;
    }

@media screen and (-ms-view-state: snapped) {
    .fragment header[role=banner] {
        -ms-grid-columns: auto 1fr;
        margin-left: 20px;
    }

        .fragment header[role=banner] .win-backbutton {
            margin: 0;
            margin-right: 10px;
            margin-top: 76px;
        }

            .fragment header[role=banner] .win-backbutton:disabled {
                display: none;
            }

        .fragment header[role=banner] .titlearea {
            -ms-grid-column: 2;
            margin-left: 0;
            margin-top: 68px;
        }
}

@media screen and (-ms-view-state: fullscreen-portrait) {
    .fragment header[role=banner] {
        -ms-grid-columns: 100px 1fr;
    }

        .fragment header[role=banner] .win-backbutton {
            margin-left: 29px;
        }
}

I would post all the JS code too, but their is quite a lot of it just to post in one topic! It’s basically using your web development skills, and making an app; obviously you just need to learn the standard practice for building within Windows 8 and not your general web browser.

175 posts
  • Has referred 10+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Located in Australia
+2 more
michaeldale says

This is great. Thanks so much for posting it!

I purchased a Surface and am hoping to add some Windows 8 Ties for some of my applications, I just haven’t had time to look at it yet.

Awesome awesome. THanks!

56 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has collected 1+ items on Envato Market
  • Located in United Kingdom
+4 more
JMDDesigns says

This is great. Thanks so much for posting it!

I purchased a Surface and am hoping to add some Windows 8 Ties for some of my applications, I just haven’t had time to look at it yet.

Awesome awesome. THanks!

No problems! It is great that people are taking advantage of it now, I really do think it has mass potential. Obviously care & quality assurance will play a large role throughout any apps created, so hopefully some good content can be made.

I’m just putting the project on to GitHub now so people can have a look at the code for a basic app with sliding pages, loading splash screen, tabbed content and tiles that hold content pages.

56 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has collected 1+ items on Envato Market
  • Located in United Kingdom
+4 more
JMDDesigns says

Here’s the Git Respiratory. I can only upload the basic files. VB won’t allow me to upload/move MS related files. https://github.com/JMDDesigns/Win-8-Development-Example

Here’s what it looks like on the first loaded page included pages plus grouped elements.

\\

\\

\\

175 posts
  • Has referred 10+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Located in Australia
+2 more
michaeldale says

That looks really cool. I haven’t written a windows app in a while.

Does Visual Studio simply give you an option to create an HTML /CSS style Metro UI app? Is that how it works? Do you code the html from within Visual Studio?

56 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has collected 1+ items on Envato Market
  • Located in United Kingdom
+4 more
JMDDesigns says

That looks really cool. I haven’t written a windows app in a while. Does Visual Studio simply give you an option to create an HTML /CSS style Metro UI app? Is that how it works? Do you code the html from within Visual Studio?

Surprisingly, yes, the HTML and CSS can all be written in VS, and the the two themes come as standard named dark.ui.css & light.ui.css, you override the theme settings in your own CSS file. For example:

body {background:#11111;} 

This would colour the pages backgrounds. It’s pretty simple, it’s just you have to learn a bunch of new CSS peseuado’s that target content written in HTML . It’s been a while too, but I must say its good to find more interest this time!

320 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $1,000+ on Envato Market
  • Had an item featured in an Envato Bundle
  • Has collected 1+ items on Envato Market
+2 more
jwmcpeak says

I don’t see Metro apps being a category here at CodeCanyon unless its in code form. Microsoft is pretty strict on how those apps are obtained and installed. They do have a different deployment scheme for businesses that want to deploy in-house apps on Win8 devices, but to my knowledge, that is the only exception to the rule.

56 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has collected 1+ items on Envato Market
  • Located in United Kingdom
+4 more
JMDDesigns says

I don’t see Metro apps being a category here at CodeCanyon unless its in code form. Microsoft is pretty strict on how those apps are obtained and installed. They do have a different deployment scheme for businesses that want to deploy in-house apps on Win8 devices, but to my knowledge, that is the only exception to the rule.

Yup, this was my only worry. Microsoft probably do have strict policies on how Apps can be obtained, plus any licensing to go with that. Maybe over time things will ease out, but until then, I suppose we could just develop and wait. I have already sent an App to MS for release on the marketplace, but I won’t hold my hopes up for a response anytime soon.

There are also some strict guidelines on what must be used and must not be. You can’t use your freedom unlike in web design. You are restricted to the Metro theme including icons (they cannot be overridden), the only exception is you can style it to your comfort with any XML /HTML/Web App/API content needed.

by
by
by
by
by
by