반응형
Firebase DB를 사용하여 RecyclerView에 출력하고, 갱신 버튼을 눌러, DB를 reloading하여 출력해 보자.
1. dependency 추가
implementation 'androidx.recyclerview:recyclerview:1.3.0'
implementation 'com.github.bumptech.glide:glide:4.10.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.10.0'2. activity_main.xml에 recyclerview 추가. reload 버튼 추가
<Button
android:id="@+id/btn_Reload"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="reload"
/>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
3. 아이템 디자인 list_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/iv_profile"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="@mipmap/ic_launcher"
/>
<LinearLayout
android:layout_marginLeft="15dp"
android:gravity="center_vertical"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical"
>
<TextView
android:id="@+id/tv_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello"/>
<TextView
android:id="@+id/tv_pw"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello"/>
<TextView
android:id="@+id/tv_userName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>4. 아이템 class. User class (getter and setter 는 alt+insert키로 쉽게 자동생성 하세요.. )
public class User {
private String profile ;
private String id ;
private int pw ;
private String userName ;5. CustomAdapter class
public class CustomAdapter extends RecyclerView.Adapter<CustomAdapter.CustomViewHolder> {
private ArrayList<User> arrayList ;
private Context context ;
public CustomAdapter(ArrayList<User> arrayList, Context context) {
this.arrayList = arrayList;
this.context = context;
}
@NonNull
@Override
public CustomAdapter.CustomViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.list_item, parent, false) ;
CustomViewHolder holder = new CustomViewHolder(view) ;
return holder; // 홀더 리턴
}
@Override
public void onBindViewHolder(@NonNull CustomAdapter.CustomViewHolder holder, int position) {
Glide.with(holder.itemView)
.load(arrayList.get(position).getProfile())
.into(holder.iv_profile) ;
holder.tv_id.setText(arrayList.get(position).getId());
holder.tv_pw.setText(String.valueOf(arrayList.get(position).getPw()));
holder.tv_userName.setText(arrayList.get(position).getUserName());
}
@Override
public int getItemCount() {
return (arrayList!=null ? arrayList.size(): 0);
}
public class CustomViewHolder extends RecyclerView.ViewHolder {
ImageView iv_profile ;
TextView tv_id ;
TextView tv_userName ;
TextView tv_pw ;
public CustomViewHolder(@NonNull View itemView) {
super(itemView);
iv_profile = itemView.findViewById(R.id.iv_profile) ;
tv_id = itemView.findViewById(R.id.tv_id) ;
tv_userName = itemView.findViewById(R.id.tv_userName) ;
tv_pw = itemView.findViewById(R.id.tv_pw) ;
}
}
}
6. Firebase 설정.
Tools - firebase 선택. (예전엔 수작업으로 한 거를 편리하게 다 해준다..)
우측에 Realtime Database 메뉴를 선택한다. Get started with Realtime Database 로 가서, 차례로 진행한다.
connect your app to firebase ; 브라우저로 구글 로그인하여 firebase 콘솔로 가서 프로젝트 생성까지 진행됨.
(실시간 DB를 잘 만든다. 필드도 User class에 맞게 다 맞춘다. +를 눌러 User를 만들고 다시 +를 눌러 User_01을 만들고 다시 +를 눌러 profile, id, pw, userName 필드들을 만든다. 처음엔 사용법을 몰라 어렵다. 하위 노드를 위해 미리 +를 연속해서 눌러줘야 된다. 미리 만들고, 엔터치면 하위에 추가가 안되서 삽질.. )
Add the Realtime Database to your app ; dependency 등을 알아서 설정해 준다.
그러나,... 나의 경우는 빌드시 에러가... 찾아보니, 버전 문제가 또 있다... (어쩌라고.. 정말 막막하게 만드는 버전 호환성...)
build.gradle (project) 에서 4.3.10 으로 들어가 있는데 찾아보니 버전을 14로 올리면 해결된다고 해서 해보니 성공하였음.
classpath 'com.google.gms:google-services:4.3.14'
7.MainActivity에서 RecyclerView와 Adapter 연결 및 Firebase 연동...
public class MainActivity extends AppCompatActivity {
private RecyclerView recyclerView ;
private RecyclerView.Adapter adapter ;
private RecyclerView.LayoutManager layoutManager ;
private ArrayList<User> arrayList ;
private FirebaseDatabase database ;
private DatabaseReference databaseReference ;
private ValueEventListener valueEventListener ;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
recyclerView = findViewById(R.id.recyclerview) ;
recyclerView.setHasFixedSize(true);
layoutManager = new LinearLayoutManager(this) ;
recyclerView.setLayoutManager(layoutManager);
arrayList = new ArrayList<User>() ;
adapter = new CustomAdapter(arrayList, this) ;
recyclerView.setAdapter(adapter);
database = FirebaseDatabase.getInstance();
databaseReference = database.getReference("User") ; // User table
valueEventListener = new ValueEventListener() {
@Override
public void onDataChange(@NonNull DataSnapshot snapshot) {
Log.e("AAA", "reload data") ;
// 데이터를 수신.
arrayList.clear();
for (DataSnapshot ds : snapshot.getChildren()) {
User user = ds.getValue(User.class) ;
Log.e("AAA", user.getId()) ;
arrayList.add(user) ;
}
adapter.notifyDataSetChanged();
}
@Override
public void onCancelled(@NonNull DatabaseError error) {
Log.e("AAA", error.toString()) ;
}
} ;
databaseReference.addListenerForSingleValueEvent(valueEventListener);
findViewById(R.id.btn_Reload).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
databaseReference.addListenerForSingleValueEvent(valueEventListener);
}
});
}
}- Reload를 어떻게 하나 궁금했는데 찾아보니 위와 같이 하니 되었다. databaseReference에 리스너를 또 등록하면 됨. 그러면 노드들을 다시 가져오고 갱신되었다.
'Develop > Android' 카테고리의 다른 글
| ViewPager2, TabLayout (0) | 2023.03.19 |
|---|---|
| [Android] JSON 데이터 송수신 (1) | 2023.03.18 |