Category: java

First layout in XML

Okay, here I am with the very first layout using XML for Java purposes. I will show you how I understand the idea of designing the view.

First of all you have to think what your app will show.You should always try to reduce the amount of objects on the screen. Simplicity is a key to success.
You have to mind about the differences between screen sizes and resolution. I am using the Xperia Tablet Z (1st generation) which orders me to think more about positioning.

So let’s begin! Designing app has 3 major steps:

  1. Select the Views (ImageView, TextView etc.)
  2. Position the Views
  3. Style the Views

First point – selecting the views

This is the most important (in my opinion) step cause you have to know exactly what objects you want to have on the screen. Remember, less is better. For example let’s look at Google Maps app:

mapy-google-trasa

As you can see there are the most important details only. No useless images, textures or gradients.
TextView is responsible for showing text on the screen, ImageView for images of course.
Using these two, you can build really great app, there is no need in introducing more by now.


Point number 2 – positioning

As you can conclude bright and simply design is very important. Try to set things with your own experience. Where do you look most of the time? There should be the most important info.

Positioning is handled by many attributes, for example layout_width or layout_height.
Many depends on the choosen type of layout (Relative/Linear – there is also another but not important at this stage).
When you choose LinearLayout you have to think about the order of the objects, weight (ratio of the size of views) or just a size.
When it comes to RelativeLayout remember that you have children and parent. It means that every TextView or ImageView is a child of the whole – here parent.
When you are positioning a text you do it in a reference to the sides of the screen – that are the maximum height and width of the parent.


Now the last one, number 3 – styling the Views

This is the biggest point and I could write endless story about styling.
What you have to know is that you can set almost every parameter, from color of the text to the padding of the image. Actually I don’t exactly know if padding/margins belong to positioning or styling but let’s say that here is their place.

Here is some of my code (not whole app, just an example) that I have written during the course, app that shows some text on image, it can be everything. I will discuss few atributes which style our layout.


<ImageView
    android:src="@drawable/a"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scaleType="centerCrop" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Happy Birthday John!"
    android:textColor="@android:color/white"
    android:textSize="52sp"
    android:fontFamily="sans-serif-light"
    android:layout_marginLeft="20dp"
    android:layout_marginTop="20dp" />

android:src says what file are we using
android:scaleType describes the way that image is cropped
android:textSize can be given in sp or dp, it depends if we want always scalled text or exact size in pixels
android:fontFamily is just a font type (you can find types in documentation)
android:layout_margin describes the gap between side and object (here text)
android:padding describes the gap between side of the View and objet (here text)

That are only few examples but if you want to enlarge your knowledge just click here.
This site is an official Android API Guide which is updated frequently.

That’s all for today, my next step is building more advanced app with more objects and little more tricky positioning/styling.

Stay tuned!

What I’ve learnt

Last year I’ve won a Google Scholarship from Java. I decided to complete it during my free time. I have been doing the course for a month now and my blog has started today so I will only list all the things I have learnt recently.

First of all they explained few important definitions and how the views work, later a XML course. We’ve learnt how to use TextView, ImageView, how works wrapping the content.

Second part of course was oriented at layout building. They shown us how to create simply mobile layouts like Google Clanedar or Google Play apps.
I’ve learnt about LinearLayout and RelativeLayout, parent match, layout weight, padding and margin.

Now I’m on the practice set part of course. There are few interesting tools for beginning developers which I would link this here but I’m afraid that it would break the license of the course. Actually Google indexes it within searching results so click.
This tool will help you understand the basics without installing reccommended by Google – Android Studio.

What I’m going to learn during the following week? Working with text and positioning it for sure. What’s more I will code my first project which will help you design simply birthday cards.

//Maybe I will set someting like progress bar or to-do list on my blog, will see, it would be really helpful.