Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

Keyboard Input
Started by Tapps - enterprise Sep 12 2014 06:43 AM

12 replies to this topic
[TOPIC CONTROLS]
This topic has been archived. This means that you cannot reply to this topic.
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#1

Tapps - enterprise

[GLOBAL: userInfoPane.html]
Tapps - enterprise
  • Enthusiast

  • 75 posts
  • Corona SDK

Hello everyone,

 

On Android and iOS devices we can use the native.newTextField() to create a text input area for the user. Is there something similar yet for wp8 ?



[TOPIC: post.html]
#2

Joshua Quick

[GLOBAL: userInfoPane.html]
Joshua Quick
  • Moderator

  • 3,397 posts
  • Corona Staff

No.  And there is no plans on implementing this in the foreseeable future either.  Our main focus is on the rendering and audio side.  The parts that are more challenging to implement in a native WP8 app via DirectX.  Microsoft already makes UI development simple via Visual Studio, its XAML UI designer, and C#.  So, I recommend that you leverage Microsoft's tool for the UI side.

 

Our CoroaPanel XAML control is set up to be a container of other XAML controls.  So, what you can do is drag-and-drop a "TextBox" within the CoronaPanel via Visual Studio's UI designer.  You can get to the UI designer by double clicking the "MainPage.xaml" file in the "Solution Explorer" panel in Visual Studio.  I recommend that you set up and handle XAML control input on the C# side according to Microsoft's documentation, who in my opinion make UI handling much simpler than Apple and Google's UI frameworks.  You can interact between C# and Lua via our documentation here...

   http://docs.coronalabs.com/daily/coronacards/wp8/index.html#lua-interop-communications



[TOPIC: post.html]
#3

Tapps - enterprise

[GLOBAL: userInfoPane.html]
Tapps - enterprise
  • Enthusiast

  • 75 posts
  • Corona SDK

Alright, thanks for pointing me in the right direction!



[TOPIC: post.html]
#4

Joshua Quick

[GLOBAL: userInfoPane.html]
Joshua Quick
  • Moderator

  • 3,397 posts
  • Corona Staff

Just curious.  How many apps of yours does this affect?

And which native UI controls do you use?

 

I ask because if it's blocking several of your apps, then we might reconsider adding maybe 1 or 2 native controls.  We just don't have the time and resources to implement all of the native UI APIs that we've got within a reasonable time.  Plus, we currently don't support native.* APIs on CoronaCards for iOS and Android.  But if its a huge blocker for you and other beta developers, then we can make an exception.

 

That said, I think you should still give Visual Studio's UI designer a try.  It's actually easy to use and you'll have far more control over your UI than you would via Corona's Lua APIs.



[TOPIC: post.html]
#5

Tapps - enterprise

[GLOBAL: userInfoPane.html]
Tapps - enterprise
  • Enthusiast

  • 75 posts
  • Corona SDK

I'd say it's around 5-6 games that native controls.

 

This apps use only an Editable Text Field. We won't use the XAML UI designer directly most likely, because of how we have structured our lua/native code separation. We use a single native project and change what game to build dynamically. I'll probably expose the keyboard input through the native/lua bridge.

 

Another question. You said that native.* API's are not supported, so I guess this means no showAlert either right ? Between the two (text fields and alerts) I'd say alerts are more important to us.



[TOPIC: post.html]
#6

Joshua Quick

[GLOBAL: userInfoPane.html]
Joshua Quick
  • Moderator

  • 3,397 posts
  • Corona Staff

>> Another question. You said that native.* API's are not supported, so I guess this means no showAlert either right?

 

Right.  We do not support native.showAlert() either.  In fact, that's a tougher issue.  Microsoft's "System.Windows.MessageBox" class, which is the native alert dialog equivalent, has this one ugly nuance where showing it will completely block the main UI thread... which would also completely block the Corona runtime and rendering since it is synced to the main UI thread too.  It also has an additional problem where you can't customize its button text either.  We (or you) would have to create a custom non-blocking message box dialog to make it work like how it does on iOS and Android.  This is just one of the challenges of cross-platform development.

 

So, do many of your apps use native alerts too?

I was considering making a special case for this since many apps do use it.



[TOPIC: post.html]
#7

Tapps - enterprise

[GLOBAL: userInfoPane.html]
Tapps - enterprise
  • Enthusiast

  • 75 posts
  • Corona SDK

I think most of our apps (if not all) use alerts. We use it mainly as feedback messages from interactions with the "outside" (some iap responses, messages to facebook), with the only exception being when we ask for the user to rate our app.

 

If the native MessageBox is a blocking call, I'll probably use a "mock" alert box done in lua. It should be simpler than working with threads in both lua/native side.



[TOPIC: post.html]
#8

Joshua Quick

[GLOBAL: userInfoPane.html]
Joshua Quick
  • Moderator

  • 3,397 posts
  • Corona Staff

I'll talk with the rest of the team this coming Monday if we should sneak in native.showAlert() support then.  Especially since it impacts the majority of your apps.  Are there any other missing features that are blocking most of your apps too?

 

Just to let you know, we're planning on releasing a public version of CoronaCards for WP8 soon.  We're currently trying to decide if we have enough features to justify this.

 

Oh and side note; there will be a new Corona WP8 update next week which will fully support our Lua "crypto" APIs.  All algorithms will be supported.  Since you make heavy use of our network APIs, I thought that might interest you.



[TOPIC: post.html]
#9

Tapps - enterprise

[GLOBAL: userInfoPane.html]
Tapps - enterprise
  • Enthusiast

  • 75 posts
  • Corona SDK

Thats great! The showAlert feature would help a lot.

 

The only other missing feature that I can remember for now is Facebook support, but this one is not a blocking feature. Facebook integration usually has it's own problems (though it's been better since the api change), so we'll probably launch the first version without and see add support for it later (either through our own integration or Corona's).



[TOPIC: post.html]
#10

Tapps - enterprise

[GLOBAL: userInfoPane.html]
Tapps - enterprise
  • Enthusiast

  • 75 posts
  • Corona SDK

Hey Joshua,

 

I saw in the other thread that the showAlert feature should be coming this week. Did you guys decided to include in this next build a native text field ?

 

We are finishing up our firsts ports, and I'd like to know where to focus next.



[TOPIC: post.html]
#11

Joshua Quick

[GLOBAL: userInfoPane.html]
Joshua Quick
  • Moderator

  • 3,397 posts
  • Corona Staff

We've just finished native alert support yesterday.  We're working on pushing out a new WP8 build to you and everyone else as soon as possible.

 

The next feature we were planning on implementing is system.openURL() support.

We've had requests for it.  We need it for our internal purposes as well.  Hopefully it will be useful to you too.

 

We were not planning on adding native text field support in the near future.  Have you tried implementing it yourself via Visual Studio's designer?  I could offer some pointer to help you get started if you want to try giving that a go.



[TOPIC: post.html]
#12

Tapps - enterprise

[GLOBAL: userInfoPane.html]
Tapps - enterprise
  • Enthusiast

  • 75 posts
  • Corona SDK

I glanced over the doc on how to use the keyboard input but haven't done any coding yet, but it seemed straight forward enough. But I'd appreciate if you can give some pointers.



[TOPIC: post.html]
#13

Joshua Quick

[GLOBAL: userInfoPane.html]
Joshua Quick
  • Moderator

  • 3,397 posts
  • Corona Staff

What you need to use is the .NET "System.Windows.Controls.TextBox" class, which supports single line and multiline text.

   http://msdn.microsoft.com/en-us/library/system.windows.controls.textbox(v=vs.110).aspx

 

The tricky part is positioning it on the screen.  If you want to position the text box relative to Corona's content coordinates, that's much more difficult.  Instead, I recommend that you do something simpler and create your own "User Control" that you can display as a popup window in the middle of the screen containing all of the native text fields, labels, and buttons you need.

 

Here's a quick step-by-step procedure on how you can do this:

  1. Go to the "Solution Explorer" panel in Visual Studio.
  2. Right click on the project node in the tree.  It's the child node under the root "Solution" node.
  3. Click on "Add\Item" in the popup menu.
  4. Select "Windows Phone User Control" in the list and give the control a name like "MyPopup.xaml".  (You can give it a better name later.)
  5. Visual Studio's UI designer will now show you a blank user control that you can design.
  6. In Visual Studio's "Toolbox" panel, you can drag-and-drop control such as TextBoxes and Buttons to your user control.  Go ahead and do so (for testing purposes) and then click save.
  7. Open your "MainPage.xaml.cs" file in Visual Studio.
  8. Add the following code to the bottom of the MainPage() constructor to display your user control on startup.
var myPopup = new MyPopup();
myPopup.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
myPopup.VerticalAlignment = System.Windows.VerticalAlignment.Center;
fCoronaPanel.Children.Add(myPopup);

That's it!  You've now create a user control that can be used to display a native popup onscreen.  The next trick is to use Corona's native-to-lua bridge so that your Lua script can display the popup instead of doing so in your MainPage constructor (which was just for testing purposes).  The cool thing about this approach is that you can use Visual Studio's nice UI designer to layout the popup exactly the way you want it... and your user control is its own C# class and can control the text input and button input itself.  You'll probably want to play with Microsoft's layout panels too so that it'll be sized nicely on different resolution displays, such as via a "StackPanel" class.

 

In any case, I hope this will be a good start for you.  The steps may look long up above, but I'm just being detailed.  This is actually a very simple way to create your own native input popups.




[topic_controls]
[/topic_controls]