ANDROID RECYCLERVIEW

It’s week eight at Moringa School and as I said in my first blog, I had a lot to learn and yes, I have done that and so I share with you a piece of the many things in my head, the Android Recyclerview.

Android like many other mobile platforms  is able to display a large set of information to users through the small window of a phone or tablet since its inception. The Recycler view is what is used to do this since introduction of Lollipop. It makes heavy use of a development design pattern called the Adapter Pattern and steals some elements from the commonly known Model-View-Controller pattern to map scrolling lists of data as views on the screen. Prior to this,  ListView was used but the advantage of the recyclerview is, it is  more advanced and flexible.

What is Recyclerview?

RecyclerView is an “upgraded” version of ListView which is more advance and flexible.

RecyclerView is a container for displaying large data sets that can be scrolled efficiently by maintaining a limited number of views.

RecyclerView also provides some default animations for common item operations like inserting or removing an item.

Recyclerview Architecture

Recyclerview Architecture

Data Model -> Represents one single item in a list e.g

data model

Adapter -> Pulls the items in the data model and presents items on the screen. i.e.(Content View) via the view Holder. It’s also responsible for creating view for each item and replaces new content for the view whenever the original items is no longer visible.

ViewHolder-> it is the xml layout for the one single item inflated/converted into java code. I.e. It consists of a simple class that holds the references to the UI components all the time the system shows a row in the list.

LayoutManager -> Enables one to customize how the items will be scrolled or arranged on the screen. There are three built in LayoutManager in a recyclerview

  • LinearLayoutManager:-lays items in a list

linear

  • GridLayoutManager:- lays out all items in a grid

grid

  • StaggeredGridLayoutManager:- lays out all items in a staggered grid formation, supports horizontal and vertical layouts and is able to lay out items in reverse.

staggered

  • Item Animator:- Helps one do animations on the recyclerview which was tricky and hard in a list view.
  • Item Decorator:- Used in sectioning recyclerview into different sections.

Summary

According to the English oxford  dictionary, the word recycle means re-use and that is what the recyclerview does. An example is, when one has a list of items lets say eight on the screen, and scrolls so that one gets out, seven remain. the recycler will get that one element and then pass it to the adapter. The goal of the adapter in this case is to reuse the item number one, that is in the recycler. Instead of one having to create a new view item, this item in the recycler is pushed down to the screen as item number eight.

To use recycler view one has to declare the following dependancy:-

dependencies  {  compile ‘com.android.support:appcompat-v7:21.0.0’
compile ‘com.android.support:recyclerview-v7:21.0.+’
}

To use RecyclerView, you have to create 2 essential components:

–   LayoutManager: positions items in RecyclerView and determines when to reuse item views that are no longer visible to the user.

–   RecyclerView.Adapter: provides access to data sets items, creates views for items and binds items info to item view.

Visit my github repo here, fork and clone africanshort stories to see how I implemented the recyclerview.

References

A Guide to Android RecyclerView and CardView. 2015. [Android] CardView and RecyclerView in MaA Guide to Android RecyclerView and CardViewterial Design. [ONLINE] Available at: http://www.binpress.com/tutorial/android-l-recyclerview-and-cardview-tutorial/156. [Accessed 13 May 15].

[Android] CardView and RecyclerView in Material Design Ice Tea 09. 2015. [Android] CardView and RecyclerView in Material Design. [ONLINE] Available at: http://icetea09.com/blog/2014/12/19/android-cardview-and-recyclerview-in-material-design/. [Accessed 13 May 15].

TechSmith. 1995. Devc. [ONLINE] Available at: http://blogs.techsmith.com/inside-techsmith/devcorner-android-lollipop/. [Accessed 13 May 15].

Halfway there

By Faith Muli, Moringa School Student

It’s been exactly seven weeks since I enrolled at Moringa School. For me, the ride has been nothing short of exciting while maneuvering every curve, and yes, I have learnt so much while going through a roller-coaster of emotions at the school. Nevertheless, I cherish every Michelin moment, the times I rolled with no rubber on my rims, and even the times I had no choice but to rev up my footsubishi.

Here is a brief summary of my six weeks at Moringa:

Weeks 1&2
After reaching the six week milestone at Moringa, I can openly admit that the first two weeks were by far the “easiest” so far. I am not saying that there wasn’t much learning going on but what we did then feels like burying a body in the US (Meaning – super easy)! Right now, everything is like burying a body in Africa- you need a pickaxe and a team of six rugby players to convincingly scratch the earth here.

Weeks 3&4
These were the two weeks that I walked through the valley of the shadow of confusion. I woke up one morning and found Uhuru had already built a standard gauge railway for Ruby (haha! Nerd joke).  Java became Android and UX, well UX did not change much. Nevertheless, Moringa pulled me out of the darkness and this little engine that could, did.

Weeks 5&6
These last two weeks have been rather exhausting. The hardest part was trying to assimilate all the new concepts, as well as finishing up the digital pile of assignments which grow tougher with every new concept we learn .
These last two weeks have been, like always, a great learning experience and they set the pace for the few weeks that follow when we get to create something on our own from everything we have learnt so far.

I am excited  about the next few weeks, I am sure building something from scratch will be a great experience even though I’m slightly anxious about the outcome.

I cant wait to start my second phase of the Moringa School program!

Html, Css and Pesticide.

By Clifford Owino, Moringa School Student

We all browse the web once in a while. I won’t ask you to tell your neighbor which websites you visit regularly but I would love to hear you explain to him/her how you think it works in “your own words”.

For now let me give you my version of how it goes down and then at the end, you can judge for yourself if what wrote down fits into your mental model. Either way, the web works and we hope to keep it that way.

When you type in the address eg http://pesticide.io and click enter, the browser creates a request which is then sent to the server.
The server will interpret the request and return a response in a format that the browser understands — usually HTML along with its associated CSS and optionally Javascript files.
Everything that happens on the server is server-side and what happens in your browser is client side.

As a visitor to a webpage, you are rarely concerned about the design but I want to empower you by introducing you to client-side (browser) web technologies in the hopes that you will have a better appreciation for the effort that goes on behind the scenes.

There are 3 technologies used in the browser: HTML, CSS and Javascript.
HTML: a “Markup language”. It has tags that mark-out different parts of the your HTML page.

The html tags can be nested and each tag has attributes eg

CSS: for specifying how to display the contents of html file e.g all h1 tags should have a blue text color

h1 { color: blue }

Javascript:
Enables you to manipulate the elements of the page after it finishes loading.
When the page loads the browser saves a tree like structure of where every HTML element is as a node. You can then traverse this tree structure, adding and removing elements or even changing the attributes.

How it works:
– In a webpage, everything is a rectanglular “block”. Even the text. All represented by tags, some blocks will occupy a single line no matter their width, you can’t have other elements next to them.
– Blocks/elements follow the box-model. They have borders, padding between the border and content inside them and margins between the border and elements outside them.
– The important attributes of an element are its. width, height and position. They are just 2D boxes.

Play time:
– open chrome browser and go to http://pesticide.io, click the “install on chrome” button.
This extension will help you see the true beauty of html. We will use my favourite website as the example, you can substitute mine with any other.

Ok, navigate to : https://dribbble.com/
click the “bug icon” on your top right corner of the browser just to see the border lines.
Then Right-click anywhere in the browser. Then click “inspect element”
A devTools will appear below the page.
The html tags will be displayed in the first column and the next column will show the css for selected element.
Take the magnifying glass, choose one big block in the html tags colum of the devTools.
Unselect the css rules applied to it and then you even see the changes.


Summary:

HTML : specifies the different parts of the page e.g headings(h1-h6), paragraphs(p).
CSS:  defines the styling/presentation e.g Headings font size should be 24px like h1{ font-size: 24px; }
Javascript:  adds effects to the page, e.g transitioning in/out animations, validating user input and making ajax calls in the background.

Toodles.

@colleowino

That Annoying “aidl is missing”

By Justus Mbaluka, Moringa School Student

There is a day I battled with this annoying bug in Android studio. Horrible experience where, to the best of my knowledge, no one has written something “user-friendly” about it. It was a frustrating experience spending half a day fighting this bug. It looks something like this;

aidlmissing

Android Interface Definition Language (AIDL) is the middle man between your Android process. In Android, processes need to access each other’s memory through the operating system. For this communication to be effective, the operating system needs to understand it and that’s why Android programmers have written a bunch of code to facilitate in these translation episodes. That bunch of code is now the AIDL.

If it’s missing, then you are in trouble. I haven’t figured out why it’s missing in the first place given that I didn’t delete anything as far as I know.

Anyway, I solved this problem by playing around with the build tool versions for the APIs. Lollipop, the latest Android OS existed in version 5.0 (API 21) but as usual, the open source did what it does best. It upgraded to version 5.1 (API 22) which came with Build Tool Version 22.0.1. This tool version wasn’t working for me so I rolled back to the previous 21.1.2 which worked magic for me. If you find yourself in this mess, you can try this out. Sometimes you might be forced to completely move back to API 21 as long you are using that 21.1.2 build tool version for some features to work properly but it’s a rare case.

roll back to prevoius build tool version

Enjoy your App development!

Project Weeks

By John Karanja, Moringa School Student

Week 7 of being at Moringa School is coming to an end. Technically, it ended on Friday, but for Moringa School students there is no such thing as a Monday-Friday schedule and rest on weekends. We do get a bit of rest, but most of us are in school on the weekends and those who are not, are still working from home. Sometimes we actually do spend the night in school- I’ve spent the night in school twice now. And those nights have really been productive. I’m able to get a lot of work done, because there aren’t any distractions and there is a really huge drive to get a lot of work done, because you are sacrificing your sleep.

Teaching ended week 6 and from weeks 7 to 10, we are working on group and personal projects. From week 7 onwards, it’s time for us to apply what we have learnt the last six weeks. For week 7, we are in groups and we were tasked with coming up with an idea and building an Android and web app for it. Both apps are due Monday morning of week 8. Frank’s deadlines make us laugh because they seem unrealistic at the time assignments are given. Each group had to pitch their idea to Frank, Benoy (our instructor from Hack Reactor) and the entire class. And in the process, each idea was critiqued, some ideas were scrapped, others improved on and questions were asked. This really helps when you hear what other people think. During this process, each team comes up with a MVP to have built by Monday. And each team has a team name. Our team is called team-J. Because all four members first names start with the letter J. (John,John,James and Justus) Coincidence or fate?
The aim of group projects – apart from applying what we have learnt – is to learn how to work in teams. No one ever works alone in the workplace. Another thing is learning how to work under pressure, especially when you have short deadlines – sometimes unrealistic deadlines. This is the beauty of Moringa School. We are taught practical things that happen out there in the real world and when we finally leave this place we won’t be strangers to them.

When coding comes in last!

By Justus Mbaluka, Moringa School Student

Excellence in writing code is what defines a software engineer. This is the bragging zone for anyone who is in this field. The ability to touch the lives of multitude by just a paragraph of code in text editor feels like music to the heart and soul. Such a sweet thing.

However, its quite unfortunate that coding is the least important thing in software development. My fellow geeks, no offense, it just my opinion. I can spend all day all night writing code because that’s what I fancy doing when I am not having fun with my crazy buddies.

See, as a software engineer, I have come to realize that to fully have a meaningful impact in this field, you need three key skills.

1. Logical thinking

This is vital in development process. It’s a core factor in problem solving process as far as software development process is concerned. Your ability to breakdown complex problems into their basic fundamentals and attacking them from that perspective will influence greatly how you sail in this field.

2. Communication

Once you have successfully broken down your problem into simpler task, what next? Well, not unless you are working with robots, you will have to communicate that logical process to your fellow human beings, whether techies or non techies. Your fellow engineers needs to understand what you are doing throughout the process so as to streamline the development process and meet deadlines. You will need to explain crystal clearly how your program works to your marketing team or just keep it to yourself.

3. Coding

Coding is very important. Your ability to write code fast and ferocious saves you a lot of time. This skill sets you apart and determines how much free time you can have to catch up with your family and friends. However, like one of my instructor says, anyone can learn to code. You can swallow the entire manuals and be a walking program language. The question is , can you apply that knowledge in the right way? Or is it just a case of having too many ladders and not being able to climb a wall.

I love to code. Every time I start working on my rails code, I find it hard to stop. I can have that as my breakfast and lunch. But, why am I doing this? Am I writing code for myself or is it meant to bring a difference in the world. Working with and for people is inevitable. Any software you design is meant to be used by your fellow mankind and that’s why communication is your key to your tech paradise.

10000 hours? You decide..

A Cool Wolfgang Mozart
A Cool Wolfgang Amadeus Mozart

By Ian Munene, Moringa School Student

One of the common characteristics child prodigies have is the exposure to their trade at an early age. However, this is not the reason behind their success. Their expertise can be attributed to hours and hours of unending practice. By the age of ten, they usually have so many hours of practice under their belt that success has no option but to chase them. Some of these prodigies include: Wolfgang Amadeus Mozart a prolific and influential composer, Ludwig van Beethoven a world renowned German composer and pianist among many others. They all have something in common being the level of influence they had on the music classical era. Mozart is known to have composed from the age of five being already proficient on the piano and violin. Beethoven’s tutelage also began at a very young age by his father. At age 30, he was already a widely renowned composer.

Why am I discussing fields with little or no connection to programming? I am making the point that to be really good in a field, you have to put in the work. I know it has been said time and time again but many take this for granted opting for shortcuts that will get them to the destination fastest. The path to the destination is the key to becoming the best you can be. In the past few weeks, in between the frustration and anger (am still in this stage btw) and sleepless nights, I have the feeling that I am on the right track and sooner rather than later, these things will start to make more sense than they do now. All I need to do is believe and put in the work. Remember, the race is not to the swift and the battle is not to the warriors, and neither is bread to the wise nor wealth to the discerning nor favor to men of ability; for TIME and chance overtake them all.

To view what I have done so far click here