Download - [FLISOL] Embelezando o Android – 2013
eee19.com
Importância de uma boa interface
eee19.com
eee19.com
eee19.com
Design
eee19.com
eee19.com
eee19.com
eee19.com
AVISO
eee19.com
AVISO"With great power comes great responsibility"
eee19.com
Aplicativo
eee19.com
Formas
eee19.com
XML
eee19.com
<shape>
eee19.com
android:shape=…
• oval!
• rectangle!
• line!
• ring
eee19.com
eee19.com
rectangle
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#0064A0" />
!</shape>
eee19.com
eee19.com
rectangle
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#0064A0" />
<corners android:radius="15dp" /> !</shape>
eee19.com
eee19.com
button
<selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:state_pressed="true" android:drawable="@drawable/button_pressed" /> <item android:state_focused="true" android:drawable="@drawable/button_focused" /> <item android:drawable="@drawable/button_normal" /> </selector>
eee19.com
res/drawable
• button_focused!
• button_normal!
• button_pressed!
• button
eee19.com
activity_main.xml
<Button android:id="@+id/view3" android:layout_width="120dp" android:layout_height="80dp" android:layout_marginTop="64dp"
android:background="@drawable/button" android:text="@string/button_label"
/>
eee19.com
activity_main.xml
<Button android:id="@+id/view3" android:layout_width="120dp" android:layout_height="80dp" android:layout_marginTop="64dp"
android:background="@drawable/button" android:text="@string/button_label"
android:textColor="@drawable/button_caption" />
eee19.com
button_caption.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:state_pressed="true" android:color="#0FF" /> <item android:state_focused="true" android:color="#FFF" /> <item android:color="#FFF" /> </selector>
eee19.com
eee19.com
XML Bitmap<?xml version="1.0" encoding="utf-8"?> <bitmap xmlns:android="http://schemas.android.com/apk/res/android" android:src="@[package:]drawable/drawable_resource" android:antialias=["true" | "false"] android:dither=["true" | "false"] android:filter=["true" | "false"] android:gravity=["top" | "bottom" | "left" | "right" | "center_vertical" | "fill_vertical" | "center_horizontal" | "fill_horizontal" | "center" | "fill" | "clip_vertical" | "clip_horizontal"] android:tileMode=["disabled" | "clamp" | "repeat" | "mirror"] />
eee19.com
XML Bitmap
<?xml version="1.0" encoding="utf-8"?> <bitmap xmlns:android="http://schemas.android.com/apk/res/android" android:src="@[package:]drawable/drawable_resource" android:antialias=["true" | "false"] android:dither=["true" | "false"] android:filter=["true" | "false"] android:gravity=["top" | "bottom" | "left" | "right" | "center_vertical" | "fill_vertical" | "center_horizontal" | "fill_horizontal" | "center" | "fill" | "clip_vertical" | "clip_horizontal"]
android:tileMode=["disabled" | "clamp" | "repeat" | "mirror"] />
eee19.com
XML Bitmap repeat
eee19.com
XML Bitmap mirror
eee19.com
Custom font
Typeface type = Typeface.createFromAsset(getAssets(), "fonts/Chalkboard.ttc");
eee19.com
Icon font
eee19.com
developer.android.com
eee19.com
developer.android.com
eee19.com
developer.android.com/guide/topics/resources/drawable-resource.html
eee19.com
Agora um exemplo de componente
eee19.com
SlidingMenuhttps://github.com/jfeinstein10/slidingmenu
eee19.com
SlidingMenu
• Foursquare!
• Rdio!
• 9GAG!
• Wunderlist 2!
• Falcon Pro!
• …
eee19.com
eee19.com
SlidingMenupublic class SlidingExample extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setTitle(R.string.attach); // set the content view setContentView(R.layout.content); // configure the SlidingMenu SlidingMenu menu = new SlidingMenu(this); menu.setMode(SlidingMenu.LEFT); menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN); menu.setShadowWidthRes(R.dimen.shadow_width); menu.setShadowDrawable(R.drawable.shadow); menu.setBehindOffsetRes(R.dimen.slidingmenu_offset); menu.setFadeDegree(0.35f); menu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT); menu.setMenu(R.layout.menu); } }
eee19.com
SlidingMenu<com.slidingmenu.lib.SlidingMenu xmlns:sliding="http://schemas.android.com/apk/res-auto" android:id="@+id/slidingmenulayout" android:layout_width="fill_parent" android:layout_height="fill_parent" sliding:viewAbove="@layout/YOUR_ABOVE_VIEW" sliding:viewBehind="@layout/YOUR_BEHIND_BEHIND" sliding:touchModeAbove="margin|fullscreen" sliding:behindOffset="@dimen/YOUR_OFFSET" sliding:behindWidth="@dimen/YOUR_WIDTH" sliding:behindScrollScale="@dimen/YOUR_SCALE" sliding:shadowDrawable="@drawable/YOUR_SHADOW" sliding:shadowWidth="@dimen/YOUR_SHADOW_WIDTH" sliding:fadeEnabled="true|false" sliding:fadeDegree="float" sliding:selectorEnabled="true|false" sliding:selectorDrawable="@drawable/YOUR_SELECTOR"/>
eee19.com
Referências
eee19.com
appdevwiki.com
eee19.com
Mais um pouco• Google Fonts!
• Font Squirrel!
• Fontello!
• IcoMoon
eee19.com
Obrigado
• Twitter/ADN @douglasdrumond!
• www.eee19.com!
• gplus.to/douglasdrumond