ΠΑΝΕΠΙΣΤΗΜΙΟ ΚΡΗΤΗΣ ΣΧΟΛΗ ΘΕΤΙΚΩΝ ΕΠΙΣΤΗΜΩΝ ΤΜΗΜΑ ΕΠΙΣΤΗΜΗΣ ΥΠΟΛΟΓΙΣΤΩΝ ΜΑΘΗΜΑ ΕΠΙΛΟΓΗΣ ΗΥ-464 ΑΛΛΗΛΕΠΙΔΡΑΣΗ ΑΝΘΡΩΠΟΥ - ΥΠΟΛΟΓΙΣΤΗ Διδάσκων: Κωνσταντίνος Στεφανίδης
Championed by Google and owned by Open Handset Alliance accelerate innovation in mobile and offer consumers a richer, less expensive, and better mobile experience Comprehensive open source platform designed for mobile devices Comprehensive devs: Complete software stack for a mobile device For users: works right out of the box and offers extensive customization facilities For manufacturers: complete solution for running their devices (only some hardware-specific drivers are needed) Open source Designed for mobile devices (e.g., battery powered, small screens, memory, etc.) ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 2
2005: Google buys Android, Inc. The world thinks a gphone is about to come out. 2007: the Open Handset Alliance is announced. Android is officially open sourced. 2008: the Android SDK 1.0 is released. The G1 phone, manufactured by HTC and sold by the wireless carrier T-Mobile USA, follows shortly afterward. 2009: sees a proliferation of Android-based devices. New versions of the operating system are released: Cupcake (1.5), Donut (1.6), and Eclair (2.0 and 2.1). More than 20 devices run Android. 2010: Android is second only to BlackBerry as the best-selling smart phone platform. Froyo (Android 2.2) is released and so are more than 60 devices that run it. 2011: Android is the #1 mobile platform by number of new activations and number of devices sold. The battle for dominating the tablet market is on. 2012: GoogleTV, powered by Android and running on Intel x86 chips, is released. Android is now running on everything from the smallest of screens to the largest of TVs. 2013: Google Glass, a wearable computing platform with an optical head- mounted display powered by Android is released to a select few. 2014: Beyond phones, tablets, and TVs, Android continues to be the big challenger to Embedded Linux as the platform for developing a number of specialized devices (e.g., home, automotive, etc.) ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 3
(versions earlier than API level 8 are omitted) ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 4
ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 5
ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 6
Android manifest file Provides the big picture about your app: all of its components, permissions, version, minimum API level needed to run it, etc. Dalvik executable Java source code compiled down to a Dalvik executable. It is located in a file called classes.dex Resources Everything that is not code. E.g., images and audio/video clips, XML files describing layouts, language packs, etc. Native libraries Optional Signatures A digital signature certifying that you are the author of this application ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 7
Install Java JDK available at: http://www.oracle.com/technetwork/java/javase/downlo ads/jdk7-downloads-1880260.html Install Android SDK available at: http://developer.android.com/sdk/index.html Setup an IDE tool Eclipse IDE available at: http://download.eclipse.org/eclipse/downloads/drops4/r-4.3.2-201402211700/ (to install the Android Eclipse plugin follow the instructions at: http://developer.android.com/sdk/installing/installing-adt.html) Android Studio available at: http://developer.android.com/sdk/installing/studio.html ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 8
In Eclipse, choose File New Android Project ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 9
Android Manifest File The manifest file glues everything together It explains what the application consists of, what all its main building blocks are, what permissions it requires, and so on ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 10
String resources A set of name-value pairs, where the name is the name of a string resource and the value is its actual text. By referring to strings by their made-up names, we can later change the actual value without changing any of our Java code. By using a name rather than the actual value, we can provide multiple sets of values for the same string resource. In other words, the same text could be provided in multiple languages. ΗΥ464: ΑΛΛΗΛΕΠΊΔΡΑΣΗ ΑΝΘΡΏΠΟΥ - ΥΠΟΛΟΓΙΣΤΉ Διαφάνεια 11
Layout of a screen Two ways to look at this file: graphically raw XML ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 12
Drawable resources 3 or 4 separate folders, each one for a different DPI 80dpi, 160dpi, 240dpi, 320dpi, 400+ dpi The R file The glue between the world of Java and the world of resources located in the gen folder which store auto-generated files It is an automatically generated file, and as such, you never modify it. We will use the data in it quite a bit! Java source code Core logic of your application ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 13
Activities: a single screen that the user sees on the device ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 14
Intents: messages sent among the major building blocks. They trigger an activity to start up, tell a service to start, stop, or bind to, or are simply broadcasts. ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 15
Services: run in the background and don t have any user interface components. They can perform the same actions as activities, but without any user interface. They are useful for actions that you want to perform for a while, regardless of what is on the screen ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 16
Content Providers: interfaces for sharing data between applications. By default, Android runs each application in its own sandbox Small amounts of data can be passed between applications via intents Content providers are much better suited for sharing persistent data between possibly large datasets ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 17
Broadcast receivers: system-wide publish/subscribe mechanism, or more precisely, an Observer pattern. Application context: refers to the application environment and the process within which all its components are running ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 18
Declarative User Interface Use XML to declare what the UI look like Write tags and specify elements to appear on your screen WYSIWYG tools Not good for handling user input; needs additional code Programmatic User Interface Write Java code to develop the UI Specify what happens when a user action occurs (e.g., press a button) The best of both worlds Use XML to declare the UI (layout, widgets, etc.) and switch to Java to handle user interaction ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 19
Each component is a hierarchy of View and ViewGroup objects ViewGroup: an invisible container that organizes child views View: input controls or other widgets that draw some part of the UI. This hierarchy tree can be simple or complex but simplicity is best for performance ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 20
Load the XML resource ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 21
Component id Any View object may have an integer ID associated with it, to uniquely identify the View within the tree The at-symbol (@) at the beginning of the string indicates that the XML parser should parse and expand the rest of the ID string and identify it as an ID resource. The plus-symbol (+) means that this is a new resource name that must be created and added to our resources (in the R.java file) ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 22
Layouts Provide a unique way to display the views you nest within it Note: Although you can nest one or more layouts within another layout to achieve your UI design, you should strive to keep your layout hierarchy as shallow as possible. Your layout draws faster if it has fewer nested layouts (a wide view hierarchy is better than a deep view hierarchy) ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 23
ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 24
A view group that aligns all children in a single direction, vertically or horizontally. You can specify the layout direction with the android:orientation attribute Respects margins between children and the gravity (right, center, or left alignment) of each child LinearLayout also supports assigning a weight to individual children with the android:layout_weight attribute 1dp 1dp 2dp 50% 50% ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 25
A view group that displays child views in relative positions The position of each view can be specified as: relative to sibling elements (such as to the left-of or below another view) or in positions relative to the parent RelativeLayout area (such as aligned to the bottom, left of center) A very powerful utility for designing a user interface because it can eliminate nested view groups and keep your layout hierarchy flat Complete list of layout parameters can be found at: http://developer.android.com/reference/android/ widget/relativelayout.layoutparams.html ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 26
List view A view group that displays a list of scrollable items. The list items are automatically inserted to the list using an Adapter that pulls content from a source such as an array or database query and converts each item result into a view that's placed into the list. Grid View A ViewGroup that displays items in a two-dimensional, scrollable grid. The grid items are automatically inserted to the layout using a ListAdapter. When the content for your layout is dynamic or not pre-determined, you can use a layout that subclasses AdapterView to populate the layout with views at runtime. More details can be found at:http://developer.android.com/guide/topics/ui/declaringlayout.html#adapterviews ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 27
Input controls are the interactive components in your app's user interface. Android provides a wide variety of controls you can use in your UI, such as: buttons text fields seek bars checkboxes zoom buttons toggle buttons etc. Adding an input control to your UI is as simple as adding an XML element to your XML layout Complete list of supported widgets can be found at: http://developer.android.com/reference/android/widget/packagesummary.html ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 28
Consists of text or an icon (or both text and an icon) that communicates what action occurs when the user touches it ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 29
Respond to user actions (e.g., click) or doing that programmatically ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 30
Styling Borderless Custom background Create three bitmaps for the background (default, pressed, and focused) Place the bitmaps into the res/drawable/ directory Create a new XML file in the res/drawable/ directory button_custom.xml ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 31
A text field allows the user to type text into your app Can be either single line or multi-line Touching a text field places the cursor and automatically displays the keyboard ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 32
Keyboard types text textemailaddress texturi number phone Other behaviors textcapsentences textcapwords textautocorrect textpassword textmultilinetextmultiline Autocomplete can be achieved using an Array Adapter. Details can be found at: http://developer.android.com/guide/topics/ui/controls/text.html#autocomplete ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 33
Checkboxes allow the user to select one or more options from a set Typically, you should present each checkbox option in a vertical list Responding to click events ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 34
Radio buttons allow the user to select one option from a set You should use radio buttons for optional sets that are mutually exclusive if you think that the user needs to see all available options side-by-side ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 35
A toggle button allows the user to change a setting between two states Android 4.0 (API level 14) introduces another kind of toggle button called a switch ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 36
Spinners provide a quick way to select one value from a set In the default state, a spinner shows its currently selected value Touching the spinner displays a dropdown menu with all other available values, from which the user can select a new one Spinner choices can be populated using an ArrayAdapter More details can be found at: http://developer.android.com/guide/topics/ui/controls/s pinner.html#populate ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 37
Android provides controls for the user to pick a time or pick a date as ready-to-use dialogs Each picker provides controls for selecting each part of the time (hour, minute, AM/PM) or date (month, day, year) Using these pickers helps ensure that your users can pick a time or date that is valid, formatted correctly, and adjusted to the user's locale ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 38
1 2 3 ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 39
1 2 3 ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 40
Action Bar Dedicated space for giving your app an identity and indicating the user's location in the app Makes important actions prominent Supports consistent navigation and view switching within apps Context menu and contextual action mode Popup menu ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 41
1 2 3 More details about Action Bar can be found at: http://developer.android.com/guide/topics/ui/ac tionbar.html ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 42
A dialog is a small window that prompts the user to make a decision or enter additional information A dialog does not fill the screen and is normally used for modal events that require users to take an action before they can proceed ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 43
AlertDialog A dialog that can show a title, up to three buttons, a list of selectable items, or a custom layout DatePickerDialog or TimePickerDialog A dialog with a pre-defined UI that allows the user to select a date or time Custom Dialog Create a layout and add it to an AlertDialog by calling setview() on your AlertDialog.Builder object ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 44
ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 45
ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 46
ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 47
ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 48
A notification is a message you can display to the user outside of your application's normal UI When you tell the system to issue a notification, it first appears as an icon in the notification area. To see the details of the notification, the user opens the notification drawer More details about Notifications can be found at: http://developer.android.com/guide/topics/ui/ notifiers/notifications.html ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 49
A toast provides simple feedback about an operation in a small popup It only fills the amount of space required for the message and the current activity remains visible and interactive Create a Toast Position a Toast Custom toasts styles can be defined from scratch: http://developer.android.com/guide/topics/ui/notifiers/to asts.html#customtoastview ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 50
Android offers a sophisticated and powerful componentized model for building your UI, based on the fundamental layout classes: View and ViewGroup Creating your own View subclasses gives you precise control over the appearance and function of a screen element Method: Extend an existing View class or subclass with your own class Override some of the methods from the superclass. The superclass methods to override start with 'on', for example, ondraw(), onmeasure(), and onkeydown() Use your new extension class. Once completed, your new extension class can be used in place of the view upon which it was based More details about custom components can be found at: http://developer.android.com/guide/topics/ui/custom-components.html ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 51
Accommodate multiple screen sizes (such as tablets versus phones) and orientations (landscape versus portrait) Modularize the views (the UI) such that it would be easy to separate the Activity container from the UI The developer to create a more responsive and easyto- build interface to the user s needs such as changing the interface on the fly rather than having to create completely new containers for every configuration ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 52
1 2 ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 53
Android Developer Guide:http://developer.android.com/guide/topics/ui/ overview.html Learning Android, 2nd Edition. Develop Mobile Apps Using Java and Eclipse By Marko Gargenta, Masumi Nakamura Publisher: O'Reilly Media Released: January 2014 Pages: 288 ΗΥ464: Αλληλεπίδραση Ανθρώπου - Υπολογιστή Διαφάνεια 54