[Android]5주차 스터디 - material design , Retrofit2

1. material design

material desgin이란

구글에서 만든 디자인 라이브러리로 android, ios, wed 의 ui/ux 개발에 편리하게 사용한다.

material design 사용 방법

1. build.gradle

repositories {
        google()
        mavenCentral()
    }

build.gradle > repositories > google ( ) 추가

implementation 'com.google.android.material:material:1.1.0'

build.gradle(:app) > dependencies > implementation 추가

3. styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <style name="Theme.MyApp" parent="Theme.MaterialComponents.Light.NoActionBar.Bridge">
        <!-- ... -->
        
    </style>


</resources>

res > values > styles.xml > Theme.MaterialCompnents를 상속받은 style 생성 (Theme.MyApp)

4. AndroidManifest.xml

android:theme="@style/Theme.MyApp"

AndroidManifest.xml > application > theme 수정 (Theme.MyApp)

5. 적용

<com.google.android.material.textfield.TextInputLayout
            android:id="@+id/search_term_text_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:shapeAppearance="@style/ShapeAppearance.MaterialComponents.MediumComponent"
            app:boxStrokeColor="@color/design_default_color_primary"
            app:helperText="검색어를 입력해주세요"
            app:counterEnabled="true"
            app:counterMaxLength="12"
            app:startIconDrawable="@drawable/ic_baseline_photo_library_24"
            app:endIconMode="clear_text"
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
            android:hint="사진검색">

            <com.google.android.material.textfield.TextInputEditText
                android:id="@+id/search_term_edit_text"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:maxLength="12"
                android:inputType="text"
                android:layout_marginBottom="5dp"
                />

        </com.google.android.material.textfield.TextInputLayout>

com.google.android.material.textfield.TextInputLayout , com.google.android.material.textfield.TextInputEditText 사용

2.Retrofit2

Retrofit2 이란

REST API 통신을 지원하는 라이브러리이다.

Retrofit 사용 방법

1. build.gradle

def retrofit_version = "2.8.1"
    implementation "com.squareup.retrofit2:retrofit:$retrofit_version"
    implementation "com.squareup.retrofit2:converter-gson:$retrofit_version"
    implementation "com.squareup.okhttp3:logging-interceptor:4.8.1"

build.gradle(:app) > dependencies > implementation 추가

2. AndroidManifest.xml

<uses-permission android:name="android.permission.INTERNET"/>

 

3. 적용

Retrofit Client 선언 (기본형) 

object RetrofitClient {

    private var retrofitClient : Retrofit?=null

    fun getClient(baseUrl:String):Retrofit?{
  		
        //Retrofit client 생성
        if(retrofitClient == null){
            retrofitClient=Retrofit.Builder()
                .baseUrl(baseUrl)
                .addConverterFactory(GsonConverterFactory.create())
                .client(client.build())
                .build()
        }
        return retrofitClient
    }

}

Retrofit interface

interface IRetrofit {

    @GET(API.SEARCH_PHOTOS)
    fun searchPhotos(@Query("query") searchTerm: String) : Call<JsonElement>

    @GET(API.SEARCH_USERS)
    fun searchUsers(@Query("query") searchTerm: String) : Call<JsonElement>
}

object API{
    const val Base_URL : String = "http://api.unsplash.com/"
    const val  CLIENT_ID : String =""
    const val SEARCH_PHOTOS: String ="search/photos"
    const val SEARCH_USERS: String = "search/users"
}

Retrofit Manager

class RetrofitManager {
    companion object{
        val instance = RetrofitManager()
    }
    
	//Retrofit interface 생성
    private val iRetrofit : IRetrofit? = RetrofitClient.getClient(API.Base_URL)?.create(IRetrofit::class.java)

	//사진검색 api 호출
    fun searchPhotos(searchTerm: String?, completion:(RESPONSE_STATE,String)->Unit){

        val term:String = searchTerm.let{
            it
        }?:""

        val call : Call<JsonElement> = iRetrofit?.searchPhotos(searchTerm = term).let{
            it
        }?:return

        call.enqueue(object : retrofit2.Callback<JsonElement>{
            override fun onResponse(call: Call<JsonElement>, response: Response<JsonElement>) {
                Log.d(TAG,"RetrofitManger-onResponse() called / response: ${response.body()}")
                completion(RESPONSE_STATE.OKAY,response.body().toString())
            }

            override fun onFailure(call: Call<JsonElement>, t: Throwable) {
                Log.d(TAG,"RetrofitManger-onFailure() called / t: $t")
                completion(RESPONSE_STATE.FAIL,t.toString())
            }

        })

    }

}