Android – Implementing Swipe-to-refresh method

Swipe-to-refresh (or pull-to-refresh) is a way used to refresh information pulling the view down, like GMail and Twitter apps.

swipetoupdate

Bellow, I’ll show how to implement a ListView to use this method.

First, we need to extend the ListView.

The magic happens when onTouchEvent is overridden. See below:

	@Override
	public boolean onTouchEvent(MotionEvent event) {
		//Actual Y position
		float y = event.getY();

		switch(event.getAction()){
		case MotionEvent.ACTION_DOWN:
			//Stores the Y position when screen is touched
			startY = y;
			//Allows refresh if the first visible item is the first in the list
			allowRefresh = (getFirstVisiblePosition() == 0);
			break;

		case MotionEvent.ACTION_MOVE:
			if(allowRefresh){
				if((y - startY) > REFRESH_THRESHOLD){
					refresh = true;
				}
				else{
					refresh = false;
				}
			}

			break;
		case MotionEvent.ACTION_UP:
			//Refresh
			if(refresh){
				Toast.makeText(this.getContext(), "REFRESHING", Toast.LENGTH_SHORT).show();
			}
			refresh = false;
		}

		return super.onTouchEvent(event);

Basically, the method stores Y-axis position when screen is touched (MotionEvent.ACTION_DOWN) and, sliding down (MotionEvent.ACTION_MOVE), this position is compared  with initial Y-axis. If distance between initial position and end position is greater than REFRESH_THRESHOLD constant when MotionEvent.ACTION_UP occurs, the refresh command is triggered.

So far, only message “REFRESHING” will be displayed at refresh.

Implementing an interface can let this code more functional.

Create an interface with method onRefresh.

public void onRefresh();

Also, create a setter in our ListView. That will be your listener.

public void setRefreshListener(SwipeToRefreshListener listener){
	refreshListener = listener;
}

Change case MotionEvent.ACTION_UP to run implemented method.

//Executa a atualização
if(refresh &&
	refreshListener != null){
	//Chama o método que executará a atulização
	refreshListener.onRefresh();
}

In Activity we define the object that will run the update or, like the code below, shows the message “REFRESHING”.

swipeListView.setRefreshListener(new SwipeToRefreshListener() {
	@Override
	public void onRefresh() {
		Toast.makeText(MainActivity.this, "REFRESHING", Toast.LENGTH_SHORT).show();
	}
});

Now you can use this method to do anything you want, like importing data from text file, XML or database.

The complete example can be downloaded here.


Video Game Quiz, my first Android app published in Google Play!

Trying to know more about mobile apps world, precisely Android’s app, I’ve developed a quiz app about vide games.

It shows a image and you have to guess which game the image is. If you want to play, you can download it directly from Google Play Store, through this link.

Please, feel free to classify, comment and give your opinion about Video Game Quiz in app’s page. 😉

There is some screen shots:

vg1 vg2
vg3 vg4

Google Play celebrate your 25 billion downloads with apps for US$ 0.25

Google.com copyrighted image

To celebrate 25 billion downloads, Google Play offers apps and games for 25¢ for limited time.

Apps on offer can be found here.

Enjoy!


How to show any font in your site with Google Fonts and Cufon

Unfortunately, to display texts using not defaults fonts, this fonts must be installed in user’s computer. What is a problem to the designers.

Now I show two ways to solve that, Google Web Fonts and Cufon.

Google Web Fonts

This tool, unfortunately, have a limited number of fonts that can be used, but your rendering is faster than Cufon.

How to use:

  • First, you must choose the fonts for your site. Go to http://www.google.com/webfonts.
  • Click “Add to Collection” to choose them. In this tutorial I’ve selected “Eater“, “Give You Glory” and “Bonbon“. Memorize their names to later.
  • In the blue bar below, click “Use“. Will be displayed tips for fonts and some methods to attach in your site (“3. Add this code to your website“). I’ve selected the tab “@import”:

  • Copy text box content and past in <style type=”text/css”>…</style> tag:
<style type="text/css">
@import url(http://fonts.googleapis.com/css?family=Eater|Give+You+Glory|Bonbon);
</style>
  • Use their names in “font-family” normally:
    <p style="font-family:Eater">Fonte Eater</p>
    <p style="font-family:Give You Glory">Fonte Give You Glory</p>
    <p style="font-family:Bonbon">Fonte Bonbon</p>
    

Google Web Fonts is ready to use!

Cufon

Has long been used, inclusive some WordPress templates. It allows use any fonts, an advantage against Google Web Fonts. Uploading the font, it generates scripts to be used in your site. At current version (1.09), Cufon uses Canvas, taking more processing time and some browsers doesn’t support it.

How to:

  • Download .js file. Open URL http://cufon.shoqolate.com/generate/, right click “Download” and “Save As…” (or “Salve Link As…“).
  • Continuing at http://cufon.shoqolate.com/generate/, upload your font filling “Regular typeface” field. If you want bold and/or italic, upload respective files in “Bold typeface“, “Italic typeface” and “Bold italic typeface“, not mandatory.
  • Check “The EULAs of these fonts allow Web Embedding” (basically informs that you allowed to use these fonts), configure how font will be used in your site setting configuration fields and read terms and check “I acknowledge and accept these terms“, if agree.
  • Click “Let’s do this” to download another .js file, referencing fonts uploaded.
  • Attach javascripts (.js files) in HTML file:
<script type="text/javascript" language="JavaScript" src="<PATH>/cufon-yui.js"></script>
<script type="text/javascript" language="JavaScript" src="<PATH>/<FONT>.js"></script>
  • Let’s put Cufon to work! Call “replace” method of “Cufon” object, setting tag name…:
<script type="text/javascript" language="JavaScript">
//Replaces fonts of tags H1
Cufon.replace('h1');
</script>
  • Or id attribute:
<script type="text/javascript" language="JavaScript">
//Replaces font of tags with id="header"
Cufon.replace('#header');
</script>
  • Or CSS class
<script type="text/javascript" language="JavaScript">
//Replaces font of tags with class="highlight"
Cufon.replace('.highlight');
</script>
  • You can set more fonts, setting attribute “fontFamily” in method “replace“, this way:
<script type="text/javascript" language="JavaScript">
Cufon.replace('h1', {fontFamily: 'Font 1'});
Cufon.replace('#tagID', {fontFamily: 'Font 2});
Cufon.replace('.class', {fontFamily: 'Font 3});
</script>

Cufon is ready!

Click here to download this tutorial.

Now, there is no limit to fonts!


Make video clips, animations and posters with Source Filmmaker

Valve has released Source Filmmaker, a free application that allow you to create videos with the characters of Valve’s games.

You can remodel the characters, changing your facial expressions and stances, manipulate the environment and more.

It needs 11GBs in your Hard Disk and can be downloaded directly from Steam, clicking http://store.steampowered.com/app/1840/

There’s a video that shows what is possible do with Filmmaker.


  • Advertisement

  • Advertisement

  • Copyright © 1996-2010 André L. S.. All rights reserved.
    iDream theme by Templates Next | Powered by WordPress