Android Material Design Floating Action Button Yapımı

Android Material Design Floating Action Button Yapımı

fab_button

Yapmak istediğimiz tam olarak yukarıdaki gibi liste kaydıkça kaybolup geri gelen bir buton 🙂

Android Studio için başlangıcımız şu şekilde.

build.gradle dosyası

dependencies {
    ..
    compile 'com.melnykov:floatingactionbutton:1.3.0'
    ..
}

activity_schedule_list.xml

<RelativeLayout .. xmlns:fab="http://schemas.android.com/apk/res-auto" >
    ...
    <com.melnykov.fab.FloatingActionButton android:id="@+id/add_schedule_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_add" fab:fab_colorNormal="@color/primary" fab:fab_colorPressed="@color/primaryDark" fab:fab_colorRipple="@color/primaryDark" android:layout_alignParentBottom="true" android:layout_marginBottom="44dp" />

     ...
</RelativeLayout>

Java Sınıfı

public class ActivityClass extends ActionBarActivity implements View.OnClickListener, AdapterView.OnItemClickListener {
private ListView scheduleListView;
    private TextView tvScheduleInfoText;
    private FloatingActionButton fab;
    private ImageButton actionButton;

     protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_schedule_list);

        ...

        scheduleListView = (ListView) findViewById(R.id.list);
        fab = (FloatingActionButton) findViewById(R.id.add_schedule_button);
        actionButton = (ImageButton) findViewById(R.id.add_schedule_button);

        scheduleListView.setOnItemClickListener(this);
        actionButton.setOnClickListener(this);
        fab.attachToListView(scheduleListView);

        ...

    }

    @Override
    public void onClick(View v)
    {
        if(v.getId() == actionButton.getId())
        {
            //Ne gerekiyorsa
        }
    }
    
}

colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    ...
    <color name="primary">#009688</color>
    <color name="primaryDark">#00776A</color>
    ...
</resources>

Leave a Reply

Your email address will not be published. Required fields are marked *