Skip to main content

Whilst there has been a height of activity with Nintex Workflow Cloud and Nintex for O365 over the past month or so.. The App Studio team have been feverishly coding away with the next amazing release that really sets Nintex App Studio apps apart.

 

This release you will see some UI enhancements to the build process within App Studio. Which brings the new modular design framework to the product. 

But the biggest addition is what you can now do with Custom Content... 

 

So let me show you what you can do.. Above you can see how you can move around the order of the menu. You can also add new menu items, such as a built in barcode scanner.. Which takes me back to this post that I wrote a while back Getting even deeper linking with Nintex Mobile and Nintex Mobile Enterprise . Now if you are using QR codes with deep links in them, you can use a QR code scanner all with in the Nintex App without having to rely on a 3rd party. 

 

The other menu type is content.. Eg. Videos, PDF, Office Docs and HTML.. And this is where things get really cool... So not only can you upload this contents so they are embedded in the app for reference by the app users, you can also use HTML to have a landing page. The App utilizes the devices internet browsing capabilities, so if you place a HTML file in a container it will open in the app.. Further to this, if the menu container is the first item in the menu the first HTML page in the container will become the lading page.. Confused ?? See below

Now how did I create this magic.. Well quite easy really.. Check it out.

Firstly I create a new menu item and I called it home. In this container I uploaded a HTML file that I built. 

 

This is the contents of the HTML file:

<!DOCTYPE html>
<html>
<head>
 <meta name="viewport" content="initial-scale=1.0" />
 <style>
 body {
 background-color: #000000;
 }

 h1 {
 color: #ffffff;
 }

 p {
 color: #ffffff;
 }

 .button {
 display: inline-block;
 border: 2px;
 border-color: #ffffff;
 height: 50px;
 width: 100%;
 background: #000000;
 padding: 5px 5px 5px 5px;
 color: #ffffff;
 text-align: center;
 font: bold 1.5em/40px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
 }
 .button:hover {
 background-color: #6b6a6a;
 color: darkred;
 }
 a.button {
 text-decoration: none;
 }
 </style>
</head>
<body>
 <p>
 <img src="https://image.ibb.co/cwYbbF/joga300.png">
 </p>
<p>
 <a href="ntx-jogacoach://Resources" class="button">Resources</a>
 </p>
<p>
 <a href="ntx-jogacoach://Videos" class="button">Video</a>
 </p>
<p>
 <a href="tel:+1-111-222-3333" class="button">Call JOGA HQ</a>
 </p>
<p>
 <a href="sms:+1-111-222-3333&body=Love%20your%20work." class="button">SMS JOGA HQ</a>
 </p>
<p>
 <a href="ntx-jogacoach://form?ntx-name=Marketing%20Help&Organization=JOGA&ntx-msgLoading=Loading%20Marketing%20Help%20Form&ntx-msgSuccess=Just%20Checking..%20" class="button">Marketing Help</a>
 </p>
</p>
</body>
</html>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

 

Here in source you can see where I have used deep linking to point to menu items and to also open the form "Marketing Help"

Awesome right.. In anticipation of some questions, here are a few answers ... 

  • Yes you can use iFrames
  • Yes you can use jQuery
  • No you can not reference assets within the app, eg CSS files, JS libraries..
    • But you can refer to them if they are hosted on the internet .. e.g. CDN, google fonts. etc

 

I'm super pumped about this release as it has opened up so many more scenarios for using Nintex App Studio. Imagine being able to create a field app, that has all the manuals, maps and reference material all built in to the app. So with all this power, I'd love to see what you come up.. Be sure to post some screens of your app in the comments below. 

 

Until next time happy.png 

One word: AWESOME

Hi Dan Stoll‌,

You mention:

No you can not reference assets within the app, eg CSS files, JS libraries..

  • But you can refer to them if they are hosted on the internet .. e.g. CDN, google fonts. etc

But, are files which are refered to on the Internet locally cached in case of a network outage?

Cheers,

Rick

Spot on.. If you reference items on the interwebs, you will lose some capability when offline .. With that though, I have tested in "Airplane Mode" and my logo image that is hosted on a image hosting site, still appears.. So while caching will be in effect, it isn't managed in anyway through the app. So it isn't probably something you would want to rely on. 

Great write up as always Dan!

Thanks for point this out ‌

Great to see the functionality and capabilities of this product being improved, a bit of competition can really drive improvements! 

‌ I am making one now and I just love it!!!!

I LOVE IT

Anyone using android and finding an issue net::ERR_UNKNOWN_URL_SCHEME read this blog post ‌

I have a question.  I can see there are a Forms menu option; but how can add my own ( native) forms to appear under it .  The only  Forms designer I am aware of is the Nintex Forms for Office 365 which allows me to build forms with layouts spanning a generic tablet to a Nintex Mobile Tablet.

What do you mean with native forms? The only forms which can be shown there are forms designed with Nintex Forms.

Example: A form which I design for the 'Nintex Mobile Phone' layout (O365, SharePoint 2016/2013), appear in Nintex Mobile or a custom branded Nintex App on my phone. A Nintex Workflow Cloud "form" could also be shown.

Thanks for the replying as this is what I suspected. OK, can a Form available in  App Studio,  created with the (O365) Nintex Mobile Phone layout be opened in offline mode?.  Hence the outbox could have one or more completed form submissions.

  Good suggestion on the Nintex Workflow Cloud form  - you get a few types for your input data I notice. However I assume this won't run offline.

Both (O365 and NWC) work just fine in offline mode.

Hi Daniel.. 

Once you have created your forms in Nintex Forms. Simply Export the form. You will get a form.nfp file.. When you are creating your App, head to the content area. 

Here you will see the Forms container.. You can change the name of this if you want. This is where you want to upload the form.nfp... But before you do that, a quick trick is to rename the file to the form name.. This makes it easier to manage, when you have a few forms in there.. 

Select "Add Filter"

And upload your form into the window

This will then only show that form in the mobile app.. When you open the mobile for the first time the form downloads into the app making it available to work offline..

@Dan I like that, thanks I will definitely give that a go .. and report back.

Is there a way to create a background video with auto play and redirect to the task section of the app, that would be awesome. I have a sample html/css but it does not redirect:

<!DOCTYPE html>


<html>


<head>


<meta name="viewport" content="width=device-width, initial-scale=1">


<style>


* {


box-sizing: border-box;


}





body {


margin: 0;


font-family: Arial;


font-size: 17px;


}





#myVideo {


position: fixed;


right: 0;


bottom: 0;


min-width: 100%; 


min-height: 100%;


}





.content {


position: fixed;


bottom: 0;


background: rgba(0, 0, 0, 0.5);


color: #f1f1f1;


width: 100%;


padding: 20px;


}


</style>


</head>


<body>





<video autoplay muted id="myVideo">


<source src="App.mp4" type="video/mp4">


Your browser does not support HTML5 video.


</video>





<div class="content">


<p>Welcome to App</p>


</div>





</body>


</html>

Reply


View our Community Site Map

Nintex Community Sitemap
Terms & ConditionsCookie settings