iT邦幫忙

2021 iThome 鐵人賽

DAY 24
0
Mobile Development

就是從無到有寫app系列 第 24

第24天~Firebase

  • 分享至 

  • xImage
  •  

Firebase是Firebase, Inc.在2011年發布的行動和網路應用程式開發者平台,在2014年被Google收購。 截至2020年3月,Firebase平台擁有19項產品,它們被超過150萬個應用程式採用。

https://firebase.google.com/

新增專案
https://ithelp.ithome.com.tw/upload/images/20220204/201190357zPbyBQxrE.png

近來到這裡

https://ithelp.ithome.com.tw/upload/images/20220204/20119035UejGkVPZl4.png

新增專案
https://ithelp.ithome.com.tw/upload/images/20220204/201190355LCjJ8J2Vg.png


到XML檔 也是要綁onClick

https://ithelp.ithome.com.tw/upload/images/20220204/20119035FZtydVmOvF.png

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    tools:context=".MainActivity">

    <EditText
        android:id="@+id/editText"
        android:layout_width="267dp"
        android:layout_height="70dp"
        android:layout_marginTop="76dp"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="input"
        android:textAppearance="@style/TextAppearance.AppCompat.Large"
        android:textSize="30sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.422"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="60dp"
        android:onClick="onClick"
        android:text="送出"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.432"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/editText" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="124dp"
        android:onClick="onClick"
        android:text="刪除"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.432"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button" />

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="144dp"
        android:onClick="onClick"
        android:text="更新"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.432"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button2" />
</androidx.constraintlayout.widget.ConstraintLayout>

onClick完到JAVA檔

https://ithelp.ithome.com.tw/upload/images/20220204/201190351mX3oYzGWm.png

package com.huang.myfirebase01;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    public void onClick(View view) {
    }
}

找到Firebase

https://ithelp.ithome.com.tw/upload/images/20220204/201190350FMVSOguyd.png

看到右邊

https://ithelp.ithome.com.tw/upload/images/20220204/20119035rYJZKjHTqu.png
點藍色字

https://ithelp.ithome.com.tw/upload/images/20220204/201190353u9DehQ1iH.png

要先新增之後再點
https://ithelp.ithome.com.tw/upload/images/20220204/20119035ebrpjwXQJV.png

會發生連結

https://ithelp.ithome.com.tw/upload/images/20220204/20119035zct2xwdB66.png

要看到的畫面

https://ithelp.ithome.com.tw/upload/images/20220204/20119035G5IJ2JSUvb.png

可以關掉
回到ANDROID會看到
https://ithelp.ithome.com.tw/upload/images/20220204/20119035PpihFSp8Fv.png

再來點第2個
https://ithelp.ithome.com.tw/upload/images/20220204/20119035tsyoWeKOER.png

出現的畫面按"同意"-->讓經度條跑完
https://ithelp.ithome.com.tw/upload/images/20220204/20119035PAt0QmUrg3.png

第3步到網站-規則
https://ithelp.ithome.com.tw/upload/images/20220204/20119035sIJCLh6KTW.png

原來是-false
https://ithelp.ithome.com.tw/upload/images/20220204/20119035WafvLDeCKk.png

要改成 true就是任何人何時都可以改

https://ithelp.ithome.com.tw/upload/images/20220204/20119035nG7hay6Mz4.png

https://ithelp.ithome.com.tw/upload/images/20220204/20119035vlKywYlIwQ.png


回到ANDROID可以看到Gradle Scripts的build.gradle已經新增Firebase

https://ithelp.ithome.com.tw/upload/images/20220204/20119035yj7wmp0Ndl.png

再到Project的 app的google-services.json可以看到自己的Firebase名稱

https://ithelp.ithome.com.tw/upload/images/20220204/20119035QCXGBOYbjA.png

把旁邊的第4步貼上~然後開始改"反紅"

https://ithelp.ithome.com.tw/upload/images/20220204/20119035B4wN2wI5B0.png

通通都先ALT+ENTER 讓"反紅"不見

https://ithelp.ithome.com.tw/upload/images/20220204/20119035B2zoFikfKJ.png

// Write a message to the database
        FirebaseDatabase database = FirebaseDatabase.getInstance();//產生資料
        DatabaseReference myRef = database.getReference("message");//產生參考節點

        myRef.setValue("Hello, World!");

然後按RUN

到Firebase網站看-

https://ithelp.ithome.com.tw/upload/images/20220204/20119035ydccWtHHv6.png

連上了~
https://ithelp.ithome.com.tw/upload/images/20220204/20119035STM88BRfq1.png

換看看message的字

// Write a message to the database
        FirebaseDatabase database = FirebaseDatabase.getInstance();//產生資料
        DatabaseReference myRef = database.getReference("message");//產生參考節點

        myRef.setValue("Hello, World!");

https://ithelp.ithome.com.tw/upload/images/20220204/20119035v4PY9zGclS.png

到Firebase網站
https://ithelp.ithome.com.tw/upload/images/20220204/20119035UjGUFaklFv.png

換看看Hello, World!的字

https://ithelp.ithome.com.tw/upload/images/20220204/20119035weFd9bDwEt.png

到Firebase網站

https://ithelp.ithome.com.tw/upload/images/20220204/20119035S094ElAhAl.png

連線完成~
可以看的Firebase網站說明

https://firebase.google.com/docs/android/setup?authuser=0


今天是連假的第一天~祝大家雙十節快樂
五倍卷也發了~好小0.0

因為下禮拜要面試的關係~所以一直在看C#發現其實Microsoft Visuall Studio的使用英文說明
跟Android很像~所以我的純文字說明是有用的^^

後面應該會有圖案了~現在先來純文字:

  1. 要橫的排要放入Layouts->要記得綁定
  2. 放checkBox->Layouts不好調-按紐和字都會跑入~要靠移動旁邊的tree(這個真的是小秘訣)
  3. 有時候或許調程式碼還比較快(雖然調看的到的東西比較有感覺)
  4. 要GROUP去管理...所以要有ID
  5. 如果text不能改就要從CODE去改(雖然調看的到的東西比較有感覺)
  6. 到onClick的orientation可以看到變橫的horizontal
  7. 讓linerlayout跟著副容器的大小
    在Declared Attributs裡layout_wiudth和match_wiudth 選wrap_content或0dp
    8.然後讓邊邊有留邊要選到padding(這個在有打CSS的CODE也是)
    9.Button-onCilck可以動做
    10.顯示字串:String all=””;
    就是顯示有人打的東西

希望...可以讓我繼續有鐵人發文的機會~拜託拜託


上一篇
第23天~又是JSON+ListView
下一篇
第25天~還是Firebase
系列文
就是從無到有寫app31
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言