2. TOPICS:
Generic UI Development
Android User
UI AndVUI
User Interface Design
Multichannel and Multimedia Uls
Layouts
Framing
Android Intents and services
Screen Desgin Elements,Drawing,Imaging,Activites,Permission
ImageWith Animation
3. Generic UI Development
• A good User Interface (UI) focuses on making user’s interactions simple and
efficient. User would appreciate a website with intuitive user interface that
leads them towards their task in most engaging way
• Being a UI designer, one need to understand the goals, skills, preferences
and tendencies of the user to make a better interface.
• The Generic User Interface (Generic UI, GUI) framework allows you to
create UI screens using Java and XML. XML is optional but it provides a
declarative approach to the screen layout and reduces the amount of code
which is required for building the user interface.
4.
5. The application screens consist of the
following parts:
• Descriptors – XML files for declarative definition of the screen layout and
data components.
• Controllers – Java classes for handling events generated by the screen and
its UI controls and for programmatic manipulation with the screen
components.
• A screen is a main unit of the generic UI. It contains visual components, data
containers and non-visual components. A screen can be displayed inside the
main application window either in the tab or as a modal dialog.
6. • It is very similar to screen internally, but has
a specific lifecycle and the Fragment visual
component instead ofWindow at the root of
the components tree
• A fragment is another UI building block
which can be used as part of screens
and other fragments
7. o Window – a standalone window that can be
displayed inside the main application
window in a tab or as a modal dialog.
o Fragment – a lightweight component that
can be added to windows or other
fragments.
o Screen – a base class of window controllers.
o ScreenFragment – a base class of fragment
controllers.
8.
9. Android User
• Android is the most popular operating system in the world,
with over 2.5 billion active users spanning over 190 countries.
• Created by Andy Rubin as the open-source alternative to
iPhone and Palm OS, Android quickly became the
favorite operating system for most mobile
manufacturers in the early 2010s.
10. • Android has continued to grow at a remarkable rate through its
popularity in developing countries. In Brazil, India, Indonesia,
Turkey and Vietnam, Android has over 85 percent market share.
11. • User interface (UI) design is the process designers use to build
interfaces in software or computerized devices, focusing on looks
or style
• Designers aim to create interfaces which users find easy to use and
pleasurable.
• UI design refers to graphical user interfaces and other forms—e.g.,
voice-controlled interfaces.
• User interfaces are the access points where users interact with
designs. They come in three formats:
Graphical user interfaces (GUIs)
Voice-controlled interfaces (VUIs)
Gesture-based interfaces
12. Graphical user interfaces (GUIs)—Users interact with visual
representations on digital control panels. A computer’s
desktop is a GUI.
Voice-controlled interfaces (VUIs)—Users interact with
these through their voices. Most smart assistants—e.g., Siri
on iPhone and Alexa on Amazon devices—are VUIs.
Gesture-based interfaces—Users engage with 3D design
spaces through bodily motions: e.g., in virtual reality (VR)
games.
13. Multichannel and Multimodal UI
One of the breakthroughs users can benefit of is
that automatic speech recognition (ASR) improved
highly significant over the last years. ASR now
works good for dictation tasks.
However, dictation is a highly specific use
case which does not require the extraction of
semantics from the utterances. Some
applications use speech input for form filling.
However, filling each single slot by speech
is often not more efficient then typing.
14. The question arises: What are important
challenges in using speech as a “mainstream”
modality?While ASR made significant efforts
within the last years,
e.g. partly driven by the successful application
of deep neural networks, the identification of
the intended semantic for a further processing by
the dialog manager is still a rather difficult
process.
This requires to simplify the usage of NLP
methods for information extraction, dialog
processing and presentation, so that developers
can easily deploy speech interfaces.
Since the Internet is mobile nowadays
and conversational speech is the most
convenient interaction mode of complex
applications
15. Layouts in Android UI Design
Layout Managers (or simply layouts) are said to be extensions of
the ViewGroup class. They are used to set the position of child
Views within the UI we are building.
There is a number of layout classes in the Android SDK. They
can be used, modified or can create your own to make the UI for
your Views, Fragments and Activities.
The most commonly used layout classes that are found in
Android SDK are:
FrameLayout
LinearLayout
RelativeLayout
GridLayout
16. FrameLayout- It is the simplest of the Layout Managers
that pins each child view within its frame. By default the
position is the top-left corner, though the gravity attribute
can be used to alter its locations. You can add multiple
children stacks each new child on top of the one before,
with each new View potentially obscuring the previous
ones.
17. LinearLayout- A LinearLayout aligns each of the child View in
either a vertical or a horizontal line. A vertical layout has a
column of Views, whereas in a horizontal layout there is a row
of Views. It supports a weight attribute for each child View that
can control the relative size of each child View within the
available space.
18. RelativeLayout- It is flexible than other native layouts as it lets us
to define the position of each child View relative to the other views
and the dimensions of the screen.
19. GridLayout- It was introduced in Android 4.0 (API level 14),
the Grid Layout used a rectangular grid of infinitely thin lines
to lay out Views in a series of rows and columns. The Grid
Layout is incredibly flexible and can be used to greatly
simplify layouts and reduce or eliminate the complex nesting
often required to construct UIs using the layouts described
before.
Each of these layouts is designed to scale to suit the screen
size of the host device by avoiding the used of absolute co-
ordinates of the positions or predetermined pixel values.
This makes the app suitable for the diverse set of Android
devices.
20. Android Intent
Android Intent is the message that is passed between
components such as activities, content providers, broadcast
receivers, services etc.
It is generally used with startActivity() method to invoke activity,
broadcast receivers etc.
Android intents are mainly used to:
• Start the service
•Launch an activity
•Display a web page
•Display a list of contacts
•Broadcast a message
•Dial a phone call etc.
21. Types of Android Intents
There are two types of intents in android: implicit and
explicit.
1) Implicit Intent
Implicit Intent doesn't specifiy the component. In such
case, intent provides information of available components
provided by the system that is to be invoked.
For example, you may write the following code to view the
webpage.
1.Intent intent=new Intent(Intent.ACTION_VIEW);
2.intent.setData(Uri.parse("http://www.javatpoint.com"));
3.startActivity(intent);
22. 2) Explicit Intent
Explicit Intent specifies the component. In such case,
intent provides the external class to be invoked.
1.Intent i = new Intent(getApplicationContext(), ActivityTwo.class);
2.startActivity(i);
23. Basic Types of Screens:
Smartphones have invaded almost every activity of our
lives. Different applications assist us and make life easier.
A designer’s job is to create the user interface meeting
users’ needs and making the experience pleasant and
satisfying.
Splash screen:
The first impression is one of the key points influencing the
user’s opinion about a mobile application.
When the user experience is pleasant from the very
beginning of interactions with an app, there are more chances
it’ll be more popular among users.
24. Home and menu screens:
Home screen is an essential part of any application.
In the context of mobile apps, it’s the main screen from
which users interact with most options of the application.
Home screens are designed depending on the type of
product and its purpose still there are some key elements
common for different kinds.
25. Log-in and profile screens:
Today many applications offer users creating their personal
accounts, so every designer needs to know how to work with log-in and
profile screens.
Log in screens should be minimalistic and clear so that users could
easily access the application.
26. Stats screen:
Various applications contain stats on user activities. The
more data it provides, the harder it is to create a mobile
design of a stats screen.
Designers need to make sure it is possible to see all the key
information still the screen has to be clear and usable.
27. Calendar:
Event apps, to-do list apps, and many others provide
users with the personal calendar.
Depending on the type of the application, the calendar
accomplishes certain functions such as remindings or
schedule.
The visual style should fit the mood and objectives of
the mobile app.
28. Animation in Android
Animation is the process of adding a motion effect to any
view, image, or text.
Animation in Android is generally used to give your UI a rich
look and feel.
The animations are basically of three types as follows
1.Property Animation
2.View Animation
3.Drawable Animation
29. Property Animation
Property Animation is one of the robust frameworks which
allows animating almost everything.
This is one of the powerful and flexible animations which
was introduced in Android 3.0.
30. View Animation
View Animation can be used to add animation to a specific view
to perform tweened animation on views.
Tweened animation calculates animation information such as
size, rotation, start point, and endpoint.
The example ofView Animation can be seen in Expandable
RecyclerView.
31. Drawable Animation
Drawable Animation is used if you want to animate one
image over another.
The simple way to understand is to animate drawable is to
load the series of drawable one after another to create an
animation.
A simple example of drawable animation can be seen in many
apps Splash screen on apps logo animation.
