diff --git a/README.md b/README.md index a45a75a0d..6d7784b63 100644 --- a/README.md +++ b/README.md @@ -142,7 +142,7 @@ Next, we need to create a subclass of the `FirebaseListAdapter` with the correct Firebase.setAndroidContext(this); Firebase ref = new Firebase("https://nanochat.firebaseio.com"); - mAdapter = new FirebaseListAdapter(ChatMessage.class, android.R.layout.two_line_list_item, this, ref) { + mAdapter = new FirebaseListAdapter(this, ChatMessage.class, android.R.layout.two_line_list_item, ref) { @Override protected void populateView(View view, ChatMessage chatMessage) { ((TextView)view.findViewById(android.R.id.text1)).setText(chatMessage.getName()); diff --git a/app/src/main/java/com/firebase/uidemo/RecyclerViewDemoActivity.java b/app/src/main/java/com/firebase/uidemo/RecyclerViewDemoActivity.java index 23d08fdfc..384aa7bc3 100644 --- a/app/src/main/java/com/firebase/uidemo/RecyclerViewDemoActivity.java +++ b/app/src/main/java/com/firebase/uidemo/RecyclerViewDemoActivity.java @@ -1,6 +1,5 @@ package com.firebase.uidemo; -import android.app.Activity; import android.graphics.Color; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; @@ -14,6 +13,7 @@ import android.widget.TextView; import com.firebase.client.Firebase; +import com.firebase.client.FirebaseError; import com.firebase.ui.FirebaseRecyclerViewAdapter; @@ -23,7 +23,7 @@ protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.recycler_view_demo); - final Firebase ref = new Firebase("https://nanochat.firebaseio.com"); + final Firebase ref = new Firebase("https://firebaseui.firebaseio.com/chat"); final String name = "Android User"; final Button sendButton = (Button) findViewById(R.id.sendButton); @@ -36,7 +36,14 @@ protected void onCreate(Bundle savedInstanceState) { @Override public void onClick(View v) { Chat chat = new Chat(name, messageEdit.getText().toString()); - ref.push().setValue(chat); + ref.push().setValue(chat, new Firebase.CompletionListener() { + @Override + public void onComplete(FirebaseError firebaseError, Firebase firebase) { + if (firebaseError != null) { + Log.e("FirebaseUI.chat", firebaseError.toString()); + } + } + }); messageEdit.setText(""); } }); @@ -44,53 +51,52 @@ public void onClick(View v) { FirebaseRecyclerViewAdapter adapter = new FirebaseRecyclerViewAdapter(Chat.class, android.R.layout.two_line_list_item, ChatHolder.class, ref) { @Override public void populateViewHolder(ChatHolder chatView, Chat chat) { - chatView.messageText.setText(chat.getMessage()); - chatView.messageText.setPadding(10, 0, 10, 0); - chatView.nameText.setText(chat.getName()); - chatView.nameText.setPadding(10, 0, 10, 15); + chatView.textView.setText(chat.getText()); + chatView.textView.setPadding(10, 0, 10, 0); + chatView.nameView.setText(chat.getName()); + chatView.nameView.setPadding(10, 0, 10, 15); if (chat.getName().equals(name)) { - chatView.messageText.setGravity(Gravity.END); - chatView.nameText.setGravity(Gravity.END); - chatView.nameText.setTextColor(Color.parseColor("#8BC34A")); + chatView.textView.setGravity(Gravity.END); + chatView.nameView.setGravity(Gravity.END); + chatView.nameView.setTextColor(Color.parseColor("#8BC34A")); } else { - chatView.nameText.setTextColor(Color.parseColor("#00BCD4")); + chatView.nameView.setTextColor(Color.parseColor("#00BCD4")); } } }; messages.setAdapter(adapter); - } static class Chat { String name; - String message; + String text; public Chat() { } public Chat(String name, String message) { this.name = name; - this.message = message; + this.text = message; } public String getName() { return name; } - public String getMessage() { - return message; + public String getText() { + return text; } } static class ChatHolder extends RecyclerView.ViewHolder { - TextView nameText, messageText; + TextView nameView, textView; public ChatHolder(View itemView) { super(itemView); - nameText = (TextView) itemView.findViewById(android.R.id.text2); - messageText = (TextView) itemView.findViewById(android.R.id.text1); + nameView = (TextView) itemView.findViewById(android.R.id.text2); + textView = (TextView) itemView.findViewById(android.R.id.text1); } } } diff --git a/app/src/main/res/layout/recycler_view_demo.xml b/app/src/main/res/layout/recycler_view_demo.xml index d56b4b821..9902fc9ac 100644 --- a/app/src/main/res/layout/recycler_view_demo.xml +++ b/app/src/main/res/layout/recycler_view_demo.xml @@ -3,6 +3,7 @@ xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" + tools:context=".RecyclerViewDemoActivity"> build.gradle (Module: app) + + This file contains the steps that Android Studio uses to build our app. We'll add a reference to Firebase to it, so we can start using it. + +2. add the following lines to the dependencies object at the bottom: + + compile 'com.firebase:firebase-client-android:2.3.1' + compile 'com.firebaseui:firebase-ui:0.2.0' + + This tells Gradle to include the Firebase SDK and the FirebaseUI library. + +3. Add the following inside the `android` object: + + packagingOptions { + exclude 'META-INF/LICENSE' + exclude 'META-INF/LICENSE-FIREBASE.txt' + exclude 'META-INF/NOTICE' + } + + This tells Gradle to exclude some files that otherwise create conflicts during the build. + + ![gradle.build with Firebase additions](images/3_1.png) + +4. At this stage you'll need to synchronize the project with the gradle files again. Either click the Sync Now link in the notification bar or the corresponding button in the toolbar: Sync Project with Gradle Files. + + ![Sync Project with Gradle Files button in toolbar](images/3_2.png) + + Android Studio will parse the gradle files and pick up our changes. + +5. Since Firebase is a hosted service, our app will need to be able to access the internet. +6. Open app > manifests > AndroidManifest.xml +7. Add this line inside the `manifest` element: + + + + ![INTERNET permission in AndroidManifest.xml](images/3_3.png) + +8. Now we can get to the Java code. The first step there is to set up initial connection between our code and its Firebase backend. +open `MainActivity.java` and add this code to the end of the `onCreate` method: + + Firebase.setAndroidContext(this); + + This code allows the Firebase client to keep its context. +9. Import Firebase at the top of your MainActivity by adding the following line: + + import com.firebase.client.Firebase; + +10. If Android Studio is having trouble finding the Firebase class, be sure that you've added dependencies and have synchronized the build file with the project. +11. We also want to create a connection to our database. We'll keep this connection in a member field: + + private Firebase mFirebaseRef; + + that we initialize in onCreate: + + mFirebaseRef = new Firebase("https://.firebaseio.com"); + + Be sure to replace `` with the name of the Firebase app you created in the first section. + + ![MainActivity with setAndroidContext and mFirebaseRef](images/3_4.png) + +That's all the setup that is required. Next up we'll allow the user to enter a message in our app and send the message to Firebase. + +## Send a message + +Next we'll send data to Firebase! In this step we'll allow the user to enter a message in a text box. When they then click the Send button, we will send the message to Firebase. + +![Data dashboard and app for sending a message](images/4_1.png) + +1. We'll first add the necessary views to activity_main.xml: + + + +