Presentation is loading. Please wait.

Presentation is loading. Please wait.

UI Elements 2.

Similar presentations


Presentation on theme: "UI Elements 2."— Presentation transcript:

1 UI Elements 2

2 The following example we will use the EditText widget to create a text field for user input. Once text has been entered into the field, the Enter key will display the text in a toast message. In this code example, the EditText attribute android:imeOptions is set to actionGo. This setting changes the default Done action to the Go action so that tapping the Enter key triggers the KeyPress input handler. (Typically, actionGo is used so that the Enter key takes the user to the target of a URL that is typed in.) Edit Text

3 To handle user text input, add the following code to the end of the OnCreate method in MainActivity.cs: In addition, maker sure to add the following using statement to the top of MainActivity.cs if it is not already present: Edit Text

4 Gallery A gallery is used, as expected, to display images.
Find some photos you'd like to use. Add the image files to the project's Resources/Drawable directory. In the Properties window, set the Build Action for each to AndroidResource. Open Resources/Layout/Main.axml and insert the following:

5 Gallery In the MainActivity.cs insert the following code in the OnCreate() method: To do something when an item in the gallery is clicked, an anonymous delegate is subscribed to the ItemClick event. It shows a Toast that displays the index position (zero-based) of the selected item (in a real world scenario, the position could be used to get the full sized image for some other task).

6 Gallery Next is the class constructor, where the Context for an ImageAdapter instance is defined and saved to a local field. Next, this implements some required methods inherited from BaseAdapter. The constructor and the Count property are self-explanatory. Normally, GetItem(int) should return the actual object at the specified position in the adapter, but it's ignored for this example. Likewise, GetItemId(int) should return the row id of the item, but it's not needed here. The method does the work to apply an image to an ImageView that will be embedded in the Gallery In this method, the member Context is used to create a new ImageView. The ImageView is prepared by applying an image from the local array of drawable resources, setting the Gallery.LayoutParams height and width for the image, setting the scale to fit the ImageView dimensions, and then finally setting the background to use the styleable attribute acquired in the constructor.

7 Gallery

8 Side note on timers and Threading
One of the keys to maintaining a responsive GUI is to do long- running tasks on a background thread so the GUI doesn't get blocked. Let's say we want to calculate a value to display to the user, but that value takes 5 seconds to calculate: Side note on timers and Threading

9 Side note on timers and Threading
This will work, but the application will "hang" for 5 seconds while the value is calculated. During this time, the app will not respond to any user interaction. To get around this, we want to do our calculations on a background thread: Side note on timers and Threading

10 Side note on timers and Threading
Now we calculate the value on a background thread so our GUI stays responsive during the calculation. However, when the calculation is done, our app will crash. This is because you must update the GUI from the GUI thread. Our code updates the GUI from the ThreadPool thread, causing the app to crash. We need to calculate our value on the background thread, but then do our update on the GUI thread, which is handled with Activity.RunOnUIThread: Side note on timers and Threading

11 Side note on timers and Threading


Download ppt "UI Elements 2."

Similar presentations


Ads by Google