Tutorial Layout de gaveta (Layout Drawer) android studio





Tutorial de Como Fazer um Aplicativo


Primeiro navegue pelo menu ate a pasta "values" dentro dela de um dublo clic no arquivo stylers.xml e mude o codigo para esse aqui
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
depois qeu tiver mudado o tema para NoActionBar vocÊ deve clicar com o botão direito sobre layout seguir com o curso do maus para new, "Layout Resorce File" adicione o nome toolbar_layout em root element deixe android.suport.v7.widget.Toolbar e clica em OK.

Depois que tiver criado um toolbar_layout você deve ir na opção text e mudar trocar o codigo que ouver la por esse aqui

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
   
xmlns:android="http://schemas.android.com/apk/res/android"
   
xmlns:app="http://schemas.android.com/apk/res-auto"
   
android:layout_width="match_parent" android:layout_height="wrap_content"
   
android:id="@+id/toolbar"
   
android:background="?attr/colorPrimaryDark"
   
android:minHeight="?attr/actionBarSize"
   
android:fitsSystemWindows="true"
   
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
   
>

</
android.support.v7.widget.Toolbar>

Terminando com Toolbar vocÊ deve ir agora em activity_main.xml
Antes de tools:context="nome do aplicativo.MainActivity"
você deve adicionar esse codigo

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
   
xmlns:android="http://schemas.android.com/apk/res/android"
   
xmlns:app="http://schemas.android.com/apk/res-auto"
   
xmlns:tools="http://schemas.android.com/tools"
   
android:layout_width="match_parent"
   
android:layout_height="match_parent"

E Logo Depois de tools:context="nome do aplicativo.MainActivity" você deve adicionar esse codigo

android:id="@+id/drawer_layout"
   
>
<
LinearLayout
   
android:layout_height="match_parent"
   
android:layout_width="match_parent"
   
android:orientation="vertical"
   
>
    <
include
       
android:layout_height="wrap_content"
        
android:layout_width="match_parent"
       
layout="@layout/toolbar_layout">
    </
include>
    <
FrameLayout
       
android:layout_width="match_parent"
       
android:layout_height="match_parent"
       
android:id="@+id/main_containeriner"
       
></FrameLayout>


</
LinearLayout>
    <
android.support.design.widget.NavigationView
       
android:layout_width="match_parent"
       
android:layout_height="wrap_content"
       
android:id="@+id/navigation_view"
       
android:layout_gravity="start"
       
app:menu="@menu/drawer_menu"
       
app:headerLayout="@layout/navigation_drawer_header"
       
></android.support.design.widget.NavigationView>
</
android.support.v4.widget.DrawerLayout>

Terminando o MainActivity você deve ir agora em build.gradle e adicionar esses codigos
compile 'com.android.support:appcompat-v7:23.2.0'
compile 'com.android.support:design:23.2.0'
compile 'com.android.support:support-v4:23.2.0'
se caso ja ouver um dos codigos acima apenas coloque o que estiver falatando lebre de reparar a onde o codigo esta para não dar comflito no seu aplicativo.
depois que tiver feito isso clica em Sync Now

Terminado aqui clica em app com o botão direito do mause logo em seguida va em new, Android Resorce File, de o nome de drawer_menu mude o resorce typer para menu e logo em seguida clica em ok.

substitua o codigo que estiver por esse aqui em baixo

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <
group android:checkableBehavior="single">
        <
item android:title="Home"
           
android:id="@+id/home_id"

           
></item>
       


    </
group>



   </
menu>
os intem ali emcima são os intems que aparece no menu drawer você deve adicionar um novo item usando o codigo
<item android:title="Home"
           
android:id="@+id/home_id"

           
></item>
em Title e o nome do item que vai aparecer no menu e em ID e o id do item que sera associado ao fragment.


Terminando o tutorial ali em cima vá agora em layoutclica com o botão direito sobre ele e logo em seguida new, layout resorce file de o nome de navigation_drawer_header e em root element mude para Relative Layout e clica em ok.

depois qeu eo layout estiver criado va em text e mude o codigo que esta lá por esse aqui;

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   
android:layout_width="match_parent" android:layout_height="180dp"
   
android:background="@drawable/backgraund01"
   
>

</
RelativeLayout>
nota que em android back graound esta um backgraund01 você pode mudar esse intem copiando e colando o backgraund de sua escolha na pasta drawable e logo em seguida mudando o nome backgraund01 pelo nome do arquivo que você adicinou em drawable.

finalizando aqui em cima va em strings.xml
e adicione os Strings
<string name="drawer_open">drawer open</string>
<string name="drawer_close">drawer close</string>
pronto terminando aqui vocÊ deve fazer o seguinte va em app clica com o botão direito sobre ele e va em New logo abaixo clica em fragment,fragment (blanck)de o nome de Homee desmarque Includ fragment factory methodos? includ interface calibacks? clica em finish.

Agora que o fragment esta criado vou deixar algo inportante você já pode criar outros fragmentos como sobre, rede sociais, dentre outros comforme sua vontade usando o mesmo metdodo que usou para criar o fragment home.
pronto vamos agora para parte final do tutorial que e substituir o codigo em MainActive.jav;
em import adicione os codigos
import android.support.design.widget.NavigationView;
import android.support.v4.app.FragmentTransaction;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;


subistitua todo o codigo que estiver abaixo de public class MainActivity extends AppCompatActivity

por esse aqui

{
    Toolbar toolbar;
    DrawerLayout drawerLayout;
    ActionBarDrawerToggle actionBarDrawerToggle;
    FragmentTransaction fragmentTransaction;
    NavigationView navigationView;

    @Override
   
protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        toolbar = (Toolbar)findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        drawerLayout = (DrawerLayout)findViewById(R.id.drawer_layout);
        actionBarDrawerToggle = new ActionBarDrawerToggle(this,drawerLayout,toolbar,R.string.drawer_open,R.string.drawer_close);
        drawerLayout.setDrawerListener(actionBarDrawerToggle);
        fragmentTransaction = getSupportFragmentManager().beginTransaction();
        fragmentTransaction.add(R.id.main_containeriner, new Home());
        fragmentTransaction.commit();
        getSupportActionBar().setTitle("Home...");
        navigationView = (NavigationView)findViewById(R.id.navigation_view);
        navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
           
public boolean onNavigationItemSelected(MenuItem item) {
                switch (item.getItemId()){

                    case R.id.home_id:
                        fragmentTransaction = getSupportFragmentManager().beginTransaction();
                        fragmentTransaction.replace(R.id.main_containeriner,new Home());
                        fragmentTransaction.commit();
                        getSupportActionBar().setTitle("Home Fragment");
                        item.setChecked(true);
                        drawerLayout.closeDrawers();
                        break;

                }


                return false;
            }
        });

    }

    @Override
   
protected void onPostCreate(Bundle savedInstanceState) {
        super.onPostCreate(savedInstanceState);
        actionBarDrawerToggle.syncState();
    }
}


Esta vendo o Codigo

case R.id.home_id:
                       
fragmentTransaction = getSupportFragmentManager().beginTransaction();
                       
fragmentTransaction.replace(R.id.main_containeriner,new Home());
                       
fragmentTransaction.commit();
                        getSupportActionBar().setTitle(
"Home Fragment");
                        item.setChecked(
true);
                       
drawerLayout.closeDrawers();
                       
break;
e ness aparte que você deve editar para acrencetar os fragments no menu drawer tudo que você deve fazer e mudar os codigos sublinhados pelo nome do seus fragments.

em case R.id.home_id: esta o id criado em menu drawer.

pronto esta aqui o nosso tutorial para android completo. você ja pode usar seu aplicativo com menu drawer nele.




Inscreva-se para receber


0 comentários:

Postar um comentário

.