숲속의 작은 이야기

[Android] Shared Elements Transition

여름숲_ — Mon, 28 Jan 2019 09:55:44 +0900

이번 포스팅은 Shared Elements Transition에 대한 내용입니다.

거두절미 하고 바로 시작하도록 하겠습니다.!

Shared Elements Transition?

기존에는 화면 전환 시에 좌우로 넘겨지는 듯한 효과나 Fade 효과를 이용하는 방법들이 대부분이었는데요, 오늘은 조금 다른 효과에 대해 얘기하려 합니다.

우선, 결과물을 먼저 볼까요?

Shared Elements Transition

보이시나요? 사용자에 의해 선택 된 이미지가 다음 화면까지 연결되어 보여지고 있습니다.

네 바로 오늘 주제인 Shared Elements Transition의 효과인데요, 이렇듯 화면 간에 공유 되는 요소들에 의해서 좀 더 직관적이고 부드러운 연출이 가능해졌습니다.

이번 예제는 지난 포스트의 예제를 이용하여 진행하도록 하겠습니다.

RecyclerView 사용하기

https://re-build.tistory.com/42

TransitionName 지정하기

먼저, 화면 간의 공유에 사용 할 요소에 transitionName을 지정해주어야 합니다.

custom_album_item.xml

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:id="@+id/layout_album_panel"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="vertical">

  <ImageView

android:id="@+id/img_thumb"

android:layout_width="match_parent"

android:layout_height="150dp"

android:scaleType="centerCrop"

android:transitionName="pair_thumb" />

  <LinearLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="vertical"

android:paddingBottom="5dp"

android:paddingTop="5dp">

  <TextView

android:id="@+id/txt_title"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#ffffff"

android:textSize="16dp" />

  <TextView

android:id="@+id/txt_artist"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#8e8e8e"

android:textSize="14dp" />

  </LinearLayout>

</LinearLayout>

이어서 화면 전환에 후에 보여질 레이아웃을 꾸며 보겠습니다.

activity_detail.xml

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

<ScrollView 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"

android:background="#000000"

android:overScrollMode="never"

tools:context="rebuild.com.SharedElementsTransitions.Activity.DetailActivity">

<LinearLayout

android:layout_width="match_parent"

android:layout_height="match_parent"

android:gravity="center_horizontal"

android:orientation="vertical"

android:paddingLeft="26dp"

android:paddingRight="26dp">

<ImageView

android:id="@+id/btn_back"

android:layout_width="24dp"

android:layout_height="24dp"

android:layout_gravity="left"

android:layout_marginTop="20dp"

android:src="@drawable/ic_back" />

<ImageView

android:id="@+id/img_thumb"

android:layout_width="250dp"

android:layout_height="250dp"

android:layout_marginTop="20dp"

android:scaleType="centerCrop"

android:transitionName="pair_thumb" />

<TextView

android:id="@+id/txt_title"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginTop="16dp"

android:textColor="#8e8e8e"

android:textSize="22dp"

android:textStyle="bold" />

<TextView

android:id="@+id/txt_artist"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#ffffff"

android:textSize="16dp" />

<LinearLayout

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginTop="5dp">

<TextView

android:id="@+id/txt_date"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#8e8e8e"

android:textSize="13dp" />

<TextView

android:id="@+id/txt_type"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginLeft="5dp"

android:textColor="#8e8e8e"

android:textSize="13dp" />

</LinearLayout>

<TextView

android:id="@+id/txt_introduce"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="left"

android:layout_marginTop="20dp"

android:textColor="#8e8e8e"

android:textSize="13dp" />

<RelativeLayout

android:layout_width="match_parent"

android:layout_height="wrap_content">

<android.support.v7.widget.RecyclerView

android:id="@+id/rcc_song"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_marginBottom="20dp"

android:layout_marginTop="20dp" />

</RelativeLayout>

</LinearLayout>

</ScrollView>

작성 시에 주의 하실 점은 공유 되는 요소 간의 transitionName은 동일한 이름으로 지정하셔야 합니다.

Shared Elements Transition 사용하기

이제 화면 전환 시에 공유되는 요소들에 어떻게 애니메이션을 적용하는지 살펴보도록 하겠습니다.

MainActivity.java

public class MainActivity extends AppCompatActivity implements AlbumAdapter.OnItemClickListener {

@Override

public void onItemClick(View view, AlbumVO albumVO) {

Intent intent = new Intent(MainActivity.this, DetailActivity.class);

intent.putExtra("albumVO", albumVO);

View thumbView = view.findViewById(R.id.img_thumb);

Pair<View, String> pair_thumb = Pair.create(thumbView, thumbView.getTransitionName());

ActivityOptionsCompat optionsCompat =

ActivityOptionsCompat.makeSceneTransitionAnimation(MainActivity.this, pair_thumb);

startActivity(intent, optionsCompat.toBundle());

}

}

전달 받은 View와 앞서 지정했던 transitionName을 묶어 Pair 라는 클래스에 담았습니다. 여기서 Pair<F, S>는 데이터를 좀 더 쉽게 전달하기 위한 컨테이너의 역할을 한다고 보시면 되겠습니다.

이어서, ActionOptionsCompat의 makeSceneTransitionAnimation(Activity, Pair<F, S> ... SharedElements)를 통해 애니메이션을 생성하였는데요, 예제에서는 ImageView에 대해서만 지정 하였지만, 여러개의 Pair를 생성하여 등록하셔도 무방합니다. 단! 너무 많은 사용은 오히려 앱이 조잡해 보일 수 있으니 적당히 사용하시길 권장드립니다. 과유불급.!

그럼 이제, 전환 된 Activity에서 넘겨 받은 데이터를 세팅하고 반대로 다시 이전의 Activity로 돌아올 때의 애니메이션 효과 또한 적용해 보도록 하겠습니다.

DetailActivity.java

public class DetailActivity extends AppCompatActivity implements View.OnClickListener {

private Context mContext;

private AlbumVO albumVO;

private ImageView btn_back;

private ImageView img_thumb;

private TextView txt_title;

private TextView txt_artist;

private TextView txt_date;

private TextView txt_type;

private TextView txt_introduce;

private RecyclerView rcc_song;

@Override

public void onEnterAnimationComplete() {

super.onEnterAnimationComplete();

setInit();

}

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_detail);

mContext = this;

getData();

}

private void getData() {

Intent intent = getIntent();

albumVO = (AlbumVO) intent.getSerializableExtra("albumVO");

}

private void setInit() {

btn_back = (ImageView) findViewById(R.id.btn_back);

btn_back.setOnClickListener(this);

img_thumb = (ImageView) findViewById(R.id.img_thumb);

Glide.with(mContext)

.load(albumVO.getThumb())

.into(img_thumb);

txt_title = (TextView) findViewById(R.id.txt_title);

txt_title.setText(albumVO.getTitle());

txt_artist = (TextView) findViewById(R.id.txt_artist);

txt_artist.setText(albumVO.getArtist());

txt_date = (TextView) findViewById(R.id.txt_date);

txt_date.setText(albumVO.getDate());

txt_type = (TextView) findViewById(R.id.txt_type);

txt_type.setText(albumVO.getType());

txt_introduce = (TextView) findViewById(R.id.txt_introduce);

txt_introduce.setText(albumVO.getIntroduce());

rcc_song = (RecyclerView) findViewById(R.id.rcc_song);

RecyclerView.LayoutManager mLayoutManager =

new LinearLayoutManager(mContext, LinearLayoutManager.VERTICAL, false);

rcc_song.setLayoutManager(mLayoutManager);

rcc_song.setNestedScrollingEnabled(false);

SongAdapter mSongAdapter = new SongAdapter(mContext, albumVO.getSong());

rcc_song.setAdapter(mSongAdapter);

}

@Override

public void onClick(View v) {

switch (v.getId()) {

case R.id.btn_back:

supportFinishAfterTransition();

break;

}

}

}

받아온 데이터들을 세팅하는 부분과 RecyclerView에 대한 부분은 여기서는 생략하도록 하겠습니다.

주의 깊게 보셔야 할 부분은 굵게 표시된 onEnterAnimationComplete()인데요, 메서드 이름 그대로 진입 애니메이션이 끝난 시점에 호출 됩니다. 예제에서는 여기서 받아온 데이터를 처리하도록 하였지만, 필요에 따라 생략하셔도 무방합니다. onCreate()와 onEnterAnimationComplete()에서 setInit() 메서드를 호출해가며 차이를 확인해보시기 바랍니다.

그 다음으로, 되돌아가기 버튼 클릭 시의 처리는 아주 간단하게 한 줄로 해결이 가능합니다. supportFinishAfterTransition()만 호출 해주시면 되는데요, 이것도 이름 그대로 해당 Activity를 finish() 함과 동시에 Transition 애니메이션을 동작하도록 지원하고 있습니다.

여기까지 준비된 내용이 끝났습니다.

내용이 길어 보이지만 개념적인 부분은 아주 간단하니, 한번 이해하신다면 다른 곳에 쉽게 적용하실 수 있으실 거라고 생각합니다.

그럼 이만 포스팅을 마치겠습니다.

벌써 1월도 끝나가네요.. 포스팅도 나름대로 열심히 한다고 하는데 부족함을 많이 느껴지네요.

다음 포스팅은 설 지나고 나서 쓰게 될 것 같습니다. 좀 더 많은 준비를 한 후에 뵙도록 하겠습니다. 모두들 즐거운 설 보내시길 바랍니다,!

[Android] RecyclerView 사용하기

여름숲_ — Mon, 21 Jan 2019 16:42:33 +0900

요즘 나이 먹으면 시간이 빨리 간다는 말에 격하게 공감이 가네요.....

새해가 밝은지 얼마나 됐다고 벌써 1월도 끝나가다니.. ㅠ

다들 연초에 세웠던 계획들 아직 잘 지켜지고 계신가요?

나름 지킬 수 있을 만한 것들로 세웠는데도 참 쉽지가 않네요. 그래도 계획이 조금 틀어졌다고 해서 포기하는 것보다 끝까지 노력하려고 하는 마음이 중요하다고 생각합니다. 모두들 열심히 노력해서 원하시는 결과 얻으시길

오늘은 RecyclerView에 대해 알아보려 합니다. RecyclerView는 ListView와 마찬가지로 리스트 형태의 데이터를 표현하기에 적합한 위젯인데요, ListView와는 어떤 차이가 있는지, 어떻게 사용해야 하는지에 대해 알아보도록 하겠습니다.

RecyclerView?

RecyclerView는 Lollipop(Anroid 5.0) 버전에서 처음 소개되었는데요, ListView보다 유연하고 성능이 향상되었다고 합니다. 그렇다면, RecyclerView에 대해 얘기하기 전에 ListView에 대해 먼저 알아야겠죠?

ListView에 대한 내용은 이전 포스트를 통해 확인하시기 바랍니다.

ListView 사용하기

https://re-build.tistory.com/19

그럼, 이제 RecyclerView와 ListView가 어떤 차이가 있는지 간단히 짚고 넘어가도록 하겠습니다.

ViewHoler 패턴의 의무화

ListView에서는 선택적으로 권장되던 ViewHolder 패턴이 RecyclerView에서는 이제 의무적으로 꼭! 사용하도록 변경 되었습니다.

LayoutManager 제공

ListView에서는 기본적으로 세로 타입의 리스트만 지원합니다. 물론 커스텀을 통해 여러 타입의 리스트들을 구현 할 수 있지만, 복잡한 과정을 거쳐야 했습니다. RecyclerView에서는 LayoutManager를 통해 여러 타입의 리스트들을 지원하고 커스텀 할 수 있도록 지원합니다.

	LinearLayoutManager	수직 또는 수평 타입의 리스트를 지원합니다.
	GridLayoutManager	격자형 타입의 리스트를 지원합니다.
	StaggeredGridLayoutManager	ItemView 마다 크기가 다른 리스트를 만들 수 있도록 지원합니다.

ItemDecoration 클래스 제공

ListView에서는 ItemView 사이의 간격에 대한 설정을 Divider를 통해 설정 하였다면, RecyclerView에서는 ItemDecoration 클래스를 통해 설정이 가능합니다. 다소 사용하기에 복잡해지긴 했지만 좀 더 동적인 사용과 커스텀에 유리해졌습니다.

ItemAnimator 클래스 제공

RecyclerView에서는 애니메이션에 대한 지원을 위해 ItemAnimator 클래스를 제공합니다. ItemAnimator 클래스를 통해 ItemView의 삽입이나 삭제, 이동 등의 애니메이션을 커스텀 할 수 있습니다.

터치 이벤트 강화

ListView에서는 OnItemClickListener를 통해 아이템들의 클릭 여부를 감지 했는데요, RecyclerView에서는 onItemTouchListener를 통해 뷰의 터치 이벤트를 감지합니다. 조금 복잡해 보이실 수 있겠지만, 터치 이벤트를 RecyclerView에 전달하기 전에 제어권을 가져옴으로써, 좀 더 유연한 대처가 가능해졌습니다.

RecyclerView는 ListView에 비해 좀 더 사용자의 확장성에 중점을 둔 모습이네요.

소개는 이쯤 마무리 하고 바로 실전으로 넘어가 보도록 하겠습니다.

예제에 사용 될 데이터들은 이전 포스트를 이용하여 진행될 예정입니다.

GSON 라이브러리 사용하기

https://re-build.tistory.com/41

Gradle에 라이브러리 추가하기

RecyclerView는 Supprot Library에 포함되어 있으므로, 사용을 위해서는 gradle에 추가해주어야 합니다.

build.gradle (Module: app)

dependencies {

implementation 'com.android.support:recyclerview-v7:26.1.0'

}

버전은 다른 Support Library와 동일하게 맞추어 주어야 합니다.

레이아웃에 RecyclerView 추가하기

이어서, 레이아웃을 먼저 작성하겠습니다.

activity_main.xml

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

<LinearLayout 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"

android:background="#000000"

tools:context="rebuild.com.scenetransitionanimation.Activity.MainActivity">

<android.support.v7.widget.RecyclerView

android:id="@+id/rcc_album"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:layout_marginLeft="16dp"

android:layout_marginRight="16dp"

android:overScrollMode="never"

android:scrollbars="none" />

</LinearLayout>

Adapter 클래스 구현하기

Adapter를 작성하기에 앞서, 각 아이템에 사용 될 레이아웃을 먼저 꾸며보겠습니다.

custom_album_item.xml

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:id="@+id/layout_album_panel"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="vertical">

<ImageView

android:id="@+id/img_thumb"

android:layout_width="match_parent"

android:layout_height="150dp"

android:scaleType="centerCrop" />

<LinearLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="vertical"

android:paddingBottom="5dp"

android:paddingTop="5dp">

<TextView

android:id="@+id/txt_title"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#ffffff"

android:textSize="16dp" />

<TextView

android:id="@+id/txt_artist"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#8e8e8e"

android:textSize="14dp" />

</LinearLayout>

간단하게 앨범의 썸네일 이미지를 배치 할 ImageView와 앨범의 타이틀과 가수를 표시 할 TextView들을 배치하였습니다.

이제 데이터와 RecyclerView를 연결할 Adapter를 만들어 보겠습니다.

AlbumAdapter.java

public class AlbumAdapter extends RecyclerView.Adapter<AlbumAdapter.ViewHolder> {

private Context mContext;

private ArrayList<AlbumVO> list_album;

public OnItemClickListener mOnItemClickListener = null;

public interface OnItemClickListener {

void onItemClick(View view, AlbumVO albumVO);

}

public void setOnItemClickListener(OnItemClickListener listener) {

mOnItemClickListener = listener;

}

public AlbumAdapter(Context mContext, ArrayList<AlbumVO> list_album) {

this.mContext = mContext;

this.list_album = list_album;

}

@Override

public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

View convertView = LayoutInflater.from(mContext).inflate(R.layout.custom_album_item, parent, false);

return new ViewHolder(convertView);

}

@Override

public void onBindViewHolder(ViewHolder holder, int position) {

AlbumVO albumVO = list_album.get(position);

Glide.with(mContext)

.load(albumVO.getThumb())

.thumbnail(0.5f)

.into(holder.img_thumb);

holder.txt_artist.setText(albumVO.getArtist());

holder.txt_title.setText(albumVO.getTitle());

holder.layout_album_panel.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

mOnItemClickListener.onItemClick(v, albumVO);

}

});

}

@Override

public int getItemCount() {

return list_album.size();

}

public class ViewHolder extends RecyclerView.ViewHolder {

private LinearLayout layout_album_panel;

private ImageView img_thumb;

private TextView txt_artist;

private TextView txt_title;

public ViewHolder(View convertView) {

super(convertView);

layout_album_panel = (LinearLayout) convertView.findViewById(R.id.layout_album_panel);

img_thumb = (ImageView) convertView.findViewById(R.id.img_thumb);

txt_artist = (TextView) convertView.findViewById(R.id.txt_artist);

txt_title = (TextView) convertView.findViewById(R.id.txt_title);

}

Adapter는 RecyclerView.Adapter<ViewHolder viewHolder>를 상속 받아 작성하였는데요, 어떻게 구성되어 있는지 살펴보도록 하겠습니다.

onCreateViewHolder(ViewGroup parent, int ViewType)

ViewHolder 생성 시에 호출됩니다. ViewType에 따라 여러 타입의 ViewHolder를 생성할 수도 있습니다.

처음 화면에 보이는 View에 대해 ViewHolder가 생성되며, 이후 스크롤 시에 보여지는 View들은 재활용되는 View이므로 다시 호출되지 않습니다.

onBindViewHolder(ViewHolder holder, int position)

화면에 ViewHolder가 붙을 때마다 호출됩니다. 화면에 새로운 View가 붙을 때마다 호출 되므로, 실질적인 데이터 처리는 이곳에서 이루어집니다.

getItemCount()

Item의 개수를 반환 합니다. 반환 되는 개수에 따라 생성되는 Item의 개수가 정해집니다.

위의 예제에서는 onCreateViewHolder()에서 만들어두었던 레이아웃을 ViewHolder와 연결하고, onBindViewHolder()에서는 넘겨 받은 데이터를 가져와 썸네일 이미지, 타이틀, 가수명 등을 각각 ImageView와 TextView에 세팅하는 것을 확인 하실 수 있습니다.

OnItemClickListener에 사용 된 커스텀 이벤트 리스너에 대한 상세한 내용은 지난 포스팅을 참고하시기 바랍니다.

Custom EventListener 사용하기

https://re-build.tistory.com/29

LayoutManager 설정 및 Adapter 연결하기

이어서, MainActivity에서 RecyclerView를 설정하는 방법에 대해 알아보겠습니다.

MainActivity.java

public class MainActivity extends AppCompatActivity implements AlbumAdapter.OnItemClickListener {

private Context mContext;

private RecyclerView rcc_album;

private AlbumAdapter mAlbumAdapter;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

mContext = this;

init();

}

private void init() {

rcc_album = (RecyclerView) findViewById(R.id.rcc_album);

RecyclerView.LayoutManager mLayoutManager = new GridLayoutManager(mContext, 2);

rcc_album.setLayoutManager(mLayoutManager);

mAlbumAdapter = new AlbumAdapter(mContext, getAlbumList());

mAlbumAdapter.setOnItemClickListener(this);

rcc_album.setAdapter(mAlbumAdapter);

}

@Override

public void onItemClick(View view, AlbumVO albumVO) {

Log.e("RecyclerVIew :: ", albumVO.toString())

}

LayoutManager를 통해 리스트의 형태를 GridLayout으로 지정 한 뒤, RecyclerView.setLayoutManager()로 RecyclerView에 적용해주었습니다. 또한 좀 전에 만든 AlbumAdapter를 RecyclerView.setAdapter를 통해 연결해주었습니다. 간단하죠?

이렇게 설정을 끝마쳐도 결과는 잘 나오겠지만, 리스트의 Item 사이의 간격을 조절해보기 위해 ItemDecoration을 사용해 보도록 하겠습니다.

ItemDecoration 적용하기

ItemDecoration.java

public class ItemDecoration extends RecyclerView.ItemDecoration {

private int spanCount;

private int spacing;

private int outerMargin;

public ItemDecoration(Activity mActivity) {

spanCount = 2;

spacing = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,

12, mActivity.getResources().getDisplayMetrics());

outerMargin = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,

50, mActivity.getResources().getDisplayMetrics());

}

@Override

public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {

int maxCount = parent.getAdapter().getItemCount();

int position = parent.getChildAdapterPosition(view);

int column = position % spanCount;

int row = position / spanCount;

int lastRow = (maxCount - 1) / spanCount;

outRect.left = column * spacing / spanCount;

outRect.right = spacing - (column + 1) * spacing / spanCount;

outRect.top = spacing * 2;

if (row == lastRow) {

outRect.bottom = outerMargin;

}

ItemDecoration 클래스는 RecyclerView.ItemDecoration 클래스를 상속받아 작성하였습니다. Item의 간격의 설정은 Override된 getItemOffsets()에서 해주시면 됩니다. 예제에서는 복잡하게 작성된 듯 보이지만 실질적으로 outRect의 left, right, top, bottom 값만 조절 해주시면 됩니다.

그럼 다시 Activity로 돌아와서,

MainActivity.java

public class MainActivity extends AppCompatActivity implements AlbumAdapter.OnItemClickListener {

private void init() {

rcc_album = (RecyclerView) findViewById(R.id.rcc_album);

RecyclerView.LayoutManager mLayoutManager = new GridLayoutManager(mContext, 2);

rcc_album.setLayoutManager(mLayoutManager);

rcc_album.addItemDecoration(new ItemDecoration(this))

mAlbumAdapter = new AlbumAdapter(mContext, getAlbumList());

rcc_album.setAdapter(mAlbumAdapter);

}

이렇게 한 줄만 추가해주시면 되겠습니다.

실행 화면

예제 실행 화면

이번에는 RecyclerView에 대해 간단히 알아보았는데요, 사실 깊게 파고자 하면 끝이 없어서 어디까지 포스팅을 해야할지 고민이 많습니다.

다음 포스팅은 오늘 예제에 이어 Scene Transition Animation에 대해 알아보도록 하겠습니다.

[Android] GSON 라이브러리 사용하기

여름숲_ — Thu, 17 Jan 2019 12:12:39 +0900

오늘은 간단하게 Gson 라이브러리에 대해 알아 볼 텐데요. Gson 라이브러리도 여러 종류가 있지만, 오늘 소개할 라이브러리는 Google에서 제공하는 오픈 소스 라이브러리 입니다. 다른 라이브러리들도 사용법은 비슷하기에 알아두시면 다른 라이브러리에도 쉽게 접근하실 수 있으실 겁니다.

그럼 시작하겠습니다.!

GSON 라이브러리?

GSON 라이브러리는 Java Object를 JSON으로 또는, JSON을 Java Object로의 변환을 도와주는 라이브러리입니다.

JSON?

JSON은 JavaScript Object Notation의 약자로 Name과 Value로 이루어진 하나의 텍스트 형식입니다.

JSON은 언어로부터 독립적이기 때문에 다수의 언어(C, C++, C#, java, javaScript 등)간의 데이터 교환에 사용됩니다.

JSON에서는 기본적으로 key : value 형태로 데이터를 표현합니다, 또한 데이터들을 묶어 Object(중괄호 { }로 표기)와 Array(대괄호 [ ]로 표기) 형태로 표현합니다.

일단 사용 해볼까요?

JSON 파일 준비하기

라이브러리를 사용하기에 앞서, 우선 JSON 파일을 작성하겠습니다.

데이터가 이미 있으신 분들은 건너뛰셔도 무방합니다.

album.json

{ "album" : [

{ "title" : "BINGLE BANGLE",

"artist" : "AOA",

"thumb" :

"https://musicmeta-phinf.pstatic.net/album/002/459/2459722.jpg?type=r204Fll&v=20181212201500",

"date" : "2018.05.28",

"type" : "댄스",

"song" :

["빙글뱅글 (BINGLE BANGLE)", "Super Duper", "HEAT", "Ladi Dadi", "파르페", "뚜뚜뚜"],

"introduce" :

"올 여름을 강타할 AOA표 서머송!\nAOA의 상큼발랄 펑키팝 '빙글뱅글 (Bingle Bangle)'\n\n그룹 AOA가 경쾌하고 신나는 퍼포먼스로 돌아왔다."},

{ "title" : "RBB",

"artist" : "Red Velvet",

"thumb" :

"https://musicmeta-phinf.pstatic.net/album/002/652/2652254.jpg?type=r204Fll&v=20181211115148",

"date" : "2018.11.30",

"type" : "댄스, 알앤비/어반",

"song" :

["RBB (Really Bad Boy)", "Bufferflies", "So Good", "멋있게 (Sassy Me)", "Taste", "RBB (Really Bad Boy) (English Ver."],

"introduce" :

"'대체불가 걸그룹' 레드벨벳, 2018 연말 가요계도 점령한다!\n새 미니앨범 'RBB' 공개!\n타이틀 곡 'RBB (Really Bad Boy)'로 히트 행진 잇는다!"},

{ "title" : "Circular"

"artist" : "M.C THE MAX",,

"thumb" :

"https://musicmeta-phinf.pstatic.net/album/002/798/2798709.jpg?type=r204Fll&v=20190104184015",

"date" : "2019.01.02",

"type" : "발라드",

"song" :

["사계 (하루살이)", "넘쳐흘러", "시간을 견디면", "그걸로 나는 충분해요", "너의 목소리가 들려", "물그림", "가", "Eh-O!", "Circular OP.1 (Crevasse)", "Circular OP.2 (Restored)", "사계 (하루살이) (Inst.)", "넘쳐흘러 (Inst.)", "그걸로 나는 충분해요 (Inst.)", "물그림 (Inst.)"],

"introduce" :

"'엠씨더맥스' 3년 만의 정규 앨범, 9집 [Circular] 발매!\n\n3년이라는 긴 공백 끝에 정규 9집 [Circular]로 돌아온 '엠씨더맥스'!"},

]}

예제를 위해서 위에 작성 된 Json을 파일로 프로젝트로 추가하도록 하겠습니다.

assets/album.json

위의 그림과 같이 assets 폴더 생성 후, 안에 json 파일을 넣었습니다.

자, 이제 이 JSON을 GSON을 사용하여 안드로이드에서 사용할 수 있도록 Java Object 형태로 변환하는 법에 대해 먼저 알아보겠습니다.

Gradle에 라이브러리 추가하기

GSON 라이브러리를 사용하려면 Gradle에 등록해야 합니다.

build.fradle (Module: app)

dependencies {

implementation 'com.google.code.gson:gson:2.8.5'

}

데이터 VO 클래스 작성하기

Json 데이터들을 파싱하기 전에, 먼저 데이터를 담을 그릇이 필요하겠죠?

각 앨범에 대한 정보들을 담을 VO 클래스를 작성하겠습니다.

AlbumVO.java

public class AlbumVO {

private String thumb;

private String artist;

private String date;

private String type;

private String title;

private ArrayList<String> song;

private String introduce;

public String getThumb() {

return thumb;

}

public void setThumb(String thumb) {

this.thumb = thumb;

}

public String getArtist() {

return artist;

}

public void setArtist(String artist) {

this.artist = artist;

}

public String getDate() {

return date;

}

public void setDate(String date) {

this.date = date;

}

public String getType() {

return type;

}

public void setType(String type) {

this.type = type;

}

public String getTitle() {

return title;

}

public void setTitle(String title) {

this.title = title;

}

public ArrayList<String> getSong() {

return song;

}

public void setSong(ArrayList<String> song) {

this.song = song;

}

public String getIntroduce() {

return introduce;

}

public void setIntroduce(String introduce) {

this.introduce = introduce;

}

@Override

public String toString() {

return "AlbumVO{" +

"thumb='" + thumb + '\'' +

", artist='" + artist + '\'' +

", date='" + date + '\'' +

", type='" + type + '\'' +

", title='" + title + '\'' +

", song=" + song +

", introduce='" + introduce + '\'' +

'}';

}

작성할 때 주의하실 점은 JSON에 작성하신 key와 동일하게 변수 명을 작성하셔야 합니다.

이어서, Activity에서 json파일을 불러와 파싱 하는 법을 살펴보겠습니다.

JSON 데이터 파싱하기

MainActivity.java

private ArrayList<AlbumVO> getAlbumList() {

ArrayList<AlbumVO> list_album = new ArrayList<>();

Gson gson = new Gson();

try {

InputStream is = getAssets().open("album.json");

byte[] buffer = new byte[is.available()];

is.read(buffer);

is.close();

String json = new String(buffer, "UTF-8");

JSONObject jsonObject = new JSONObject(json);

JSONArray jsonArray = jsonObject.getJSONArray("album");

int index = 0;

while (index < jsonArray.length()) {

AlbumVO albumVO = gson.fromJson(jsonArray.get(index).toString(), AlbumVO.class);

list_album.add(albumVO);

index++;

}

} catch (Exception e) {

e.printStackTrace();

}

return list_album;

}

먼저, InputStream을 열어 assets 폴더에 있는 album.json을 가져와 String 타입으로 데이터를 담았습니다.

이 상태에서는 모든 데이터가 하나의 String 타입의 문자들로 이루어져 있기 때문에 원하는 데이터를 가져오기에 어려움이 있습니다.

하여, 데이터를 각각의 앨범 단위로 나누어 AlbumVO에 담아 원하는 데이터에 접근하기 쉽도록 하겠습니다.

각 앨범의 정보를 각각의 AlbumVO에 담기 위해서 데이터를 앨범 단위로 나누어야 하겠죠?

JSONObject로 변환한 뒤, album이라는 key를 이용해 데이터를 JSONArray 형태로 변환하였습니다.

이제 JsonArray의 각 포지션마다 다른 앨범의 정보들을 가지고 있겠네요.

여기서 각각의 정보에 대한 name 값을 통해 각 데이터에 접근하여 각 데이터들을 AlbumVO에 담아도 되겠지만, 우리는 GSON 라이브러리를 사용해 한번에 해결하도록 하겠습니다.

GSON 라이브러리에도 여러가지 기능들이 있지만, 간단하게 변환에 관련되어 자주 쓰이는 것만 소개하도록 하겠습니다.

자세한 라이브러리에 대한 내용은 API Javadoc을 확인해주시길 바랍니다.

fromJson()

- JSON 형식의 데이터를 지정한 타입의 데이터로 변환합니다.

toJson()

- 지정된 타입의 데이터를 JSON 형식의 데이터로 변환합니다.

위의 예제를 예시로 들면 다음과 같이 데이터가 변환되는 것을 알 수 있습니다.

Json

AlbumVO

{

"title" : "BINGLE BANGLE",

"artist" : "AOA",

"thumb" : "https://musicmetaphinf...",

"date" : "2018.05.28",

"type" : "댄스",

"song" : ["빙글뱅글 (BINGLE BANGLE)", ... ],

"introduce" : "올 여름을 강타할 AOA ... "

}

public Class AlbumVO {

private String title = "BINGLE BANGLE";

private String artist = "AOA";

private String thumb = "https://musicmetaphinf...";

private String date = "2018.05.28";

private String type = "댄스";

private ArrayList<String> song = {"빙글뱅글 (BINGLE BANGLE)", ... };

private String introduce = "올 여름을 강타할 AOA ... ";

}

사실 설명 할 부분이 거의 없어 글이 괜히 길어진 느낌이네요.. 자세한 내용들은 API 문서에 전부 있어 따로 설명드릴 것도 없기에, 이런 것도 있구나 정도로 봐주시면 감사하겠습니다.

[Android] Circular Reveal Amimation

여름숲_ — Wed, 9 Jan 2019 17:16:07 +0900

이번 포스팅은 애니메이션 효과에 대해 말해볼까 합니다.

요즘 새로 나오는 어플들을 보면 단순히 페이지를 넘길 때나 스크롤 할 때 등 사용자의 반응에 따라 애니메이션 효과가 적용되어있는 것을 볼 수 있습니다. 딱 보기에도 뭔가 있어 보이는게 좋아보이네요. 저희도 뒤쳐질 수 없겠죠?

그럼 포스팅을 시작하겠습니다.

Circular Reveal Animation?

이름부터 생소하신 분들이 많을 거라고 예상합니다. 저 또한 그랬는데요, 흔히 알고 있던 크기 또는 투명도를 조절하거나 회전을 주는 등의 애니메이션이 아닌 새로운 애니메이션 효과에 신기하기만 했었던 것만 같습니다.

그럼 Circular Reveal Animation은 어떤 애니메이션 일까요?

Circular Reveal Animation 예시

위의 예시에서 Fab 버튼을 눌렀을 때, 원형으로 퍼져나가는 효과가 바로 Circular Reveal Animation 효과입니다. 물론 애니메이션 속도나 원의 반경 등은 조절이 가능합니다. 이어서 사용법에 대해 알아보도록 하겠습니다.

Circular Revael Animation 사용하기

먼저 레이아웃을 구성하도록 하겠습니다.

activity_main.xml

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

<RelativeLayout 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="rebuild.com.circularrevealanimation.MainActivity">

<RelativeLayout

android:id="@+id/layout_main"

android:layout_width="match_parent"

android:layout_height="match_parent">

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_centerInParent="true"

android:text="숲속의 작은 이야기"

android:textSize="30dp" />

</RelativeLayout>

<RelativeLayout

android:id="@+id/layout_content"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="#009688">

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_centerInParent="true"

android:text="숲속의 작은 이야기"

android:textColor="#FFFFFF"

android:textSize="30dp" />

</RelativeLayout>

<android.support.design.widget.FloatingActionButton

android:id="@+id/fab_toggle"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentBottom="true"

android:layout_alignParentRight="true"

android:layout_marginBottom="20dp"

android:layout_marginRight="20dp"

android:src="@drawable/ic_add"

app:backgroundTint="#009688"

app:borderWidth="0dp"

app:fabSize="normal" />

</RelativeLayout>

기본적으로 보여지는 main화면과 fab 버튼을 눌렀을 때 보여질 content 레이아웃으로 구성하였습니다.

Fab 버튼에 대한 내용은 이전 포스트를 참고해주시기 바랍니다.

FloatingActionButton 사용하기

http://re-build.tistory.com/31

이어서, Activity를 구성해 보겠습니다.

MainActivity.java

package rebuild.com.circularrevealanimation;

import android.animation.Animator;

import android.content.Context;

import android.content.res.ColorStateList;

import android.graphics.Color;

import android.os.Bundle;

import android.support.design.widget.FloatingActionButton;

import android.support.v7.app.AppCompatActivity;

import android.view.View;

import android.view.ViewAnimationUtils;

import android.widget.RelativeLayout;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

private Context mContext;

private RelativeLayout layout_content;

private FloatingActionButton fab_toggle;

private boolean isOpen = false;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

mContext = this;

init();

}

private void init() {

layout_content = (RelativeLayout) findViewById(R.id.layout_content);

layout_content.setVisibility(View.INVISIBLE);

fab_toggle = (FloatingActionButton) findViewById(R.id.fab_toggle);

fab_toggle.setOnClickListener(this);

}

private void showReveal() {

int centerX = (int) fab_toggle.getX() + fab_toggle.getWidth() / 2;

int centerY = (int) fab_toggle.getY() + fab_toggle.getHeight() / 2;

int radius = (int) Math.hypot(layout_content.getWidth(), layout_content.getHeight());

if (isOpen) {

fab_toggle.setBackgroundTintList(ColorStateList.valueOf(Color.parseColor("#009688")));

fab_toggle.setImageResource(R.drawable.ic_add);

Animator revealAnimator = ViewAnimationUtils

.createCircularReveal(layout_content, centerX, centerY, radius, 0);

revealAnimator.addListener(mRevealAnimatorListener);

revealAnimator.setDuration(300);

revealAnimator.start();

} else {

fab_toggle.setBackgroundTintList(ColorStateList.valueOf(Color.parseColor("#FFFFFF")));

fab_toggle.setImageResource(R.drawable.ic_close);

Animator revealAnimator = ViewAnimationUtils

.createCircularReveal(layout_content, centerX, centerY, 0, radius);

revealAnimator.setDuration(300);

layout_content.setVisibility(View.VISIBLE);

revealAnimator.start();

}

isOpen = !isOpen;

}

@Override

public void onClick(View v) {

switch (v.getId()) {

case R.id.fab_toggle:

showReveal();

break;

}

private Animator.AnimatorListener mRevealAnimatorListener = new Animator.AnimatorListener() {

@Override

public void onAnimationStart(Animator animation) {

}

@Override

public void onAnimationEnd(Animator animation) {

layout_content.setVisibility(View.INVISIBLE);

}

@Override

public void onAnimationCancel(Animator animation) {

}

@Override

public void onAnimationRepeat(Animator animation) {

}

@Override

public void onAnimationStart(Animator animation, boolean isReverse) {

}

@Override

public void onAnimationEnd(Animator animation, boolean isReverse) {

}

};

}

주요 부분은 굵게 표시된 부분인데요, 자세히 한번 보겠습니다.

createCircularReveal(View tagetView, int centerX, int centerY, float startRadius, float endRadius)

View tagetView

- 애니메이션을 적용 할 타겟이 되는 뷰를 지정합니다.

centerX

- 애니메이션의 중심이 되는 x좌표 값을 지정합니다.

centerY

- 애니메이션의 중심이 되는 y좌표 값을 지정합니다.

startRadius

- 애니메이션 시작 시점의 원의 반경을 지정합니다.

endRadius

- 애니메이션 종료 시점의 원의 반경을 지정합니다.

보기보다 사용이 굉장히 간단하죠?

주의하실 점은 애니메이션이 일단 시작되면 끝날 때까지 중간에 정지 할 수 없다는 점과 재 사용이 불가능 하다는 점 입니다.

간단하게 예제를 통해서 Circular Reveal Animation에 대해서 알아봤는데요, 도움이 좀 되셨을까요?

다음 포스팅도 조만간 올리도록 노력하겠습니다.

이상으로 포스팅을 마치겠습니다.

[Android] SharedPreferences 사용하기

여름숲_ — Fri, 4 Jan 2019 13:37:58 +0900

이래저래 바쁘다는 핑계로 미루다가 오랜만에 포스팅을 하게 되었습니다.

벌써 새해가 밝았네요. 저만 시간이 빨리 가는 것처럼 느껴지는 건 아니겠죠?

모두 새해에는 좋은 일이 생겼으면 좋겠습니다.

SharedPreferences?

개발을 진행하다 보면, 앱의 데이터들을 저장하여 관리해야 할 상황에 직면하게 되는데요. 데이터의 양이 많거나 중요한 데이터라면 서버나 DB, 파일의 형태로 저장을 하면 되겠지만, 간단한 설정 값이나 문자열 같은 데이터들은 DB에 저장하기에는 부담스럽고 애매한 경우가 있습니다. 이런 경우 안드로이드에서 기본적으로 제공되는 SharedPreferences를 사용하여 데이터를 관리한다면 좀 더 편리하게 사용이 가능합니다.

SharedPreferences는 데이터를 파일로 저장을 하는데요, 파일이 앱 폴더 내에 저장되므로 앱을 삭제하시면 당연히 데이터도 삭제됩니다.

자세한 파일의 위치는 아래와 같습니다.

data/data/(package_name)/shared_prefs/SharedPreference

SharedPreferences 클래스 작성하기

SharedPreferences는 데이터를 타입(String, int, .. 등)에 따라 관리하기 때문에 따로 클래스로 만들어서 사용하시면 편리합니다. 한번 만들어 두면 다른 프로젝트에 그대로 복사해서 사용이 가능하기도 합니다.

PreferenceManager.java

package rebuild.com.sharedpreferences;

import android.content.Context;

import android.content.SharedPreferences;

/**

* 데이터 저장 및 로드 클래스

public class PreferenceManager {

public static final String PREFERENCES_NAME = "rebuild_preference";

private static final String DEFAULT_VALUE_STRING = "";

private static final boolean DEFAULT_VALUE_BOOLEAN = false;

private static final int DEFAULT_VALUE_INT = -1;

private static final long DEFAULT_VALUE_LONG = -1L;

private static final float DEFAULT_VALUE_FLOAT = -1F;

private static SharedPreferences getPreferences(Context context) {

return context.getSharedPreferences(PREFERENCES_NAME, Context.MODE_PRIVATE);

}

/**

* String 값 저장

* @param context

* @param key

* @param value

public static void setString(Context context, String key, String value) {

SharedPreferences prefs = getPreferences(context);

SharedPreferences.Editor editor = prefs.edit();

editor.putString(key, value);

editor.commit();

}

/**

* boolean 값 저장

* @param context

* @param key

* @param value

public static void setBoolean(Context context, String key, boolean value) {

SharedPreferences prefs = getPreferences(context);

SharedPreferences.Editor editor = prefs.edit();

editor.putBoolean(key, value);

editor.commit();

}

/**

* int 값 저장

* @param context

* @param key

* @param value

public static void setInt(Context context, String key, int value) {

SharedPreferences prefs = getPreferences(context);

SharedPreferences.Editor editor = prefs.edit();

editor.putInt(key, value);

editor.commit();

}

/**

* long 값 저장

* @param context

* @param key

* @param value

public static void setLong(Context context, String key, long value) {

SharedPreferences prefs = getPreferences(context);

SharedPreferences.Editor editor = prefs.edit();

editor.putLong(key, value);

editor.commit();

}

/**

* float 값 저장

* @param context

* @param key

* @param value

public static void setFloat(Context context, String key, float value) {

SharedPreferences prefs = getPreferences(context);

SharedPreferences.Editor editor = prefs.edit();

editor.putFloat(key, value);

editor.commit();

}

/**

* String 값 로드

* @param context

* @param key

* @return

public static String getString(Context context, String key) {

SharedPreferences prefs = getPreferences(context);

String value = prefs.getString(key, DEFAULT_VALUE_STRING);

return value;

}

/**

* boolean 값 로드

* @param context

* @param key

* @return

public static boolean getBoolean(Context context, String key) {

SharedPreferences prefs = getPreferences(context);

boolean value = prefs.getBoolean(key, DEFAULT_VALUE_BOOLEAN);

return value;

}

/**

* int 값 로드

* @param context

* @param key

* @return

public static int getInt(Context context, String key) {

SharedPreferences prefs = getPreferences(context);

int value = prefs.getInt(key, DEFAULT_VALUE_INT);

return value;

}

/**

* long 값 로드

* @param context

* @param key

* @return

public static long getLong(Context context, String key) {

SharedPreferences prefs = getPreferences(context);

long value = prefs.getLong(key, DEFAULT_VALUE_LONG);

return value;

}

/**

* float 값 로드

* @param context

* @param key

* @return

public static float getFloat(Context context, String key) {

SharedPreferences prefs = getPreferences(context);

float value = prefs.getFloat(key, DEFAULT_VALUE_FLOAT);

return value;

}

/**

* 키 값 삭제

* @param context

* @param key

public static void removeKey(Context context, String key) {

SharedPreferences prefs = getPreferences(context);

SharedPreferences.Editor edit = prefs.edit();

edit.remove(key);

edit.commit();

}

/**

* 모든 저장 데이터 삭제

* @param context

public static void clear(Context context) {

SharedPreferences prefs = getPreferences(context);

SharedPreferences.Editor edit = prefs.edit();

edit.clear();

edit.commit();

}

간단하게 설명을 하자면,

데이터를 저장 할 때는 SharedPreferences의 Editor를 이용하여, 데이터 타입에 따라 put을 해주시면 됩니다. 마지막에 commit을 해야 적용되니 주의하시기 바랍니다.

데이터를 로드 할 때는 저장할 때 사용했던 key 값을 이용하시면 됩니다. 로드 할 때, 해당 key에 해당되는 데이터가 없다면 default로 설정한 값이 호출됩니다.

그럼 실제 Activity에서 어떻게 사용하는지 예제를 통해 살펴보도록 하겠습니다.

SharedPreferences 사용하기

간단하게 저장 된 데이터를 불러와 표시 할 TextView 하나만 배치하겠습니다.

activity_main.xml

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

<LinearLayout 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"

android:gravity="center"

tools:context="rebuild.com.sharedpreferences.MainActivity">

<TextView

android:id="@+id/txt_preferences"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textSize="30dp" />

</LinearLayout>

이어, Activity를 작성하도록 하겠습니다.

MainActivity.java

package rebuild.com.sharedpreferences;

import android.content.Context;

import android.os.Bundle;

import android.support.v7.app.AppCompatActivity;

import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

private Context mContext;

private TextView txt_preferences;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

mContext = this;

String text = PreferenceManager.getString(mContext, "rebuild");

if (text.equals("")) {

text = "저장된 데이터가 없습니다.";

PreferenceManager.setString(mContext, "rebuild", "숲속의 작은 이야기");

}

txt_preferences = (TextView) findViewById(R.id.txt_preferences);

txt_preferences.setText(text);

}

작성한 클래스를 이용해서 "rebuild"라는 key로 저장 된 데이터를 가져옵니다. 만약 가져온 데이터가 default 값이라면 데이터를 저장하도록 구성하였습니다.

최초 실행했을 때는 데이터가 없어 따로 지정한 text가 보여지겠지만, 앱을 재시작 할 경우, 저장된 값을 불러와 보여지게 되겠죠?.

결과 확인해 보겠습니다.

실행결과

좌 - 최초 실행 시 / 우 - 재 시작 시

이상으로 포스팅을 마치도록 하겠습니다.

새해에 정했던 목표들은 아직 잘 지켜나가고 계신가요? 사람이 참 부지런하기가 힘이 드네요.

새해가 되었다고 사람이 한 순간에 부지런히 변신하는 건 아니지만 자꾸 하려고 하면 조금씩이라도 달라지지 않을까요?... 제발....

23 아이텐티티

여름숲_ — Thu, 3 Jan 2019 11:32:32 +0900

Synopsis

만약 그들이 자유자재로 변할 수 있다면요?

23개의 인격을 가진 남자 케빈

그는 언제 누가 등장할지 모르는 인격들 사이를 오가며 유일하게 자신을 이해하는

플레쳐 박사에게만 자신의 이야기를 꺼내 놓는다.

어느 날, 케빈은 지금까지 등장한 적 없는 24번째 인격의 지시로 3명의 소녀들을 납치하고

오래도록 계획했던 비밀스러운 일을 꾸민다.

소녀들이 그에게서 도망치려 할수록 케빈의 인격들은 점차 폭주하기 시작하는데

그 안의 수 많은 인격 중 누가, 누구를 위해 움직이는가

나도 한마디

이전부터 유명했던 작품이라 이미 보신 분들이 많으실 거라고 생각되는데요,

이번 1월에 개봉 예정인 '글래스'라는 영화와 다음 리뷰 예정인 '언브레이커블'과 같은 세계관을 공유하고 있다고 하여 다시 한번 찾아보게 된 영화입니다. 세 작품 모두 M. 나이트 사말란 감독의 작품으로 이미 전설이 되어버린 '식스센스'의 감독으로도 굉장히 유명합니다.

영화는 납치된 3명의 여학생들과 그를 납치한 남자의 여러 인격들, 그를 치료하기 위해 정신과 상담을 맡고 있던 플레쳐 박사의 이야기가 주가 되어 진행이 되는데요, 다소 빈약해 보일 수도 있는 구성에서 다중인격 주인공을 연기한 제임스 맥어보이의 연기가 정말 영화의 전부라고 말할 수 있을 정도로 압도적인 연기력을 보여주었습니다. 어떻게 1초만에 다른사람으로 변해 연기를 할 수 있는지 경이롭기까지 합니다.

개인적으로는 결말이 조금 허무했는데요, 이번 영화는 빌런의 탄생 정도로만 보고 다음 개봉 예정인 글래스에서 제대로 된 무언가를 보여주지 않을까 기대하게 됩니다.

쿠키영상도 있습니다. 전작인 언브레이커블의 주인공이 깜짝 등장하며 같은 세계관에 있다는 것을 암시하고 있는 듯 합니다.

후속작인 글래스를 재미있게 보기 위한 영화가 아닌, 23 아이덴티티 자체로도 굉장히 매력적인 영화입니다. 앞서 말씀드린 제임스 맥어보이의 연기력을 보기 위해서라도 이 영화는 꼭 보시길 바랍니다.!

지극히 개인적인 생각으로 작성된 글입니다.

[Android] 해상도별 레이아웃 대응에 대한 고찰

여름숲_ — Tue, 23 Oct 2018 18:31:47 +0900

이번에는 여러가지 해상도를 가진 기기에 어떻게 하면 손쉽고 편하게 대응이 가능할 지에 대한 개인적인 고찰을 해보려 합니다.

혹시 더 좋은 방법을 아시는 분이나 아이디어가 있으신 분은 댓글로 알려주신다면 정말 감사하겠습니다.

안드로이드 기기들을 보면 정말 다양한 화면 사이즈를 가지고 있습니다. 개발을 진행하시게 되면 항상 고려해야 하는 부분 중의 하나가 이런 여러가지 기기들에 대해 어떻게 대응을 할 것인가? 일텐데요. 오늘은 이렇게 여러 화면에 대해 어떻게 대응하면 좋을지, 어떻게 하면 좀 더 손쉽게 관리가 가능할 지에 대해 개인적인 생각을 늘어볼 생각입니다.

레이아웃의 세분화

첫 번째로 각 기기에 대한 레이아웃 파일을 세분화하여 관리하는 방법입니다.

기기마다 레이아웃을 만들어야 한다면 화면 하나에 수백개의 레이아웃을 만들어야겠죠? 물론 그렇게 하면 엄청나게 비효율적이고, 관리 또한 엄청나게 어려워지겠죠. 그래서 안드로이드에서는 크기, 해상도, 방향 등으로 일반화하여 대응이 가능하도록 지원하고 있습니다.

화면 밀도

- 화면 공간 안의 픽셀 개수, dpi(dots per inch)에 따라 분류합니다.

	ldpi	저밀도(120dpi) 화면에 해당합니다.
	mdpi	중밀도(160dpi) 화면에 해당합니다.
	hdpi	고밀도(240dpi) 화면에 해당합니다.
	xhdpi	초고밀도(320dpi) 화면에 해당합니다.
	xxhdpi	초초고밀도(480dpi) 화면에 해당합니다.
	xxxhdpi	초초초고밀도(640dpi) 화면에 해당합니다.

- 기기의 dpi가 기준 되는 dpi와 정확하게 맞아야 하는 것은 아닙니다. 기기의 dpi와 가장 비슷한 레이아웃으로

자동으로 찾아갑니다. 이때 고밀도에서 저밀도 순으로 우선순위가 정해집니다.

최소 너비

- 사용 가능한 화면 영역의 가장 짧은 치수를 기준으로 분류합니다.

sw<N>dp

사용 예 : sw320dp, sw600dp, sw720dp

- 예를 들어, sw600dp로 분류된 레이아웃은 화면의 사용 가능한 영역 중, 가로 또는 세로 중 짧은 치수를 기준으로

600dp가 넘는 경우에만 접근이 가능하도록 합니다.

사용 가능한 화면 너비 또는 높이

- 사용 가능한 최소 너비 또는 높이를 기준으로 분류합니다.

	w<N>dp	최소 사용 가능 너비를 dp로 지정합니다.
		사용 예 : w720dp, w1024dp
	h<N>dp	최소 사용 가능 높이를 dp로 지정합니다.
		사용 예 : h720dp, h1024dp

- 이전에 사용하던 화면 크기에 따른 분류(small, normal, large, xlarge)를 대체하여 사용하도록 권장되고 있습니다.

지정된 dp를 기준으로 가로 또는 높이가 기준 dp보다 높을 경우에만 접근이 가능하도록 합니다.

- 흔히 이 방법은 가로 모드와 세로 모드가 다른 레이아웃에 대응하기 위해 사용하기도 합니다.

화면 방향

- 화면 방향에 따라 분류합니다.

	port	세로 모드에 해당합니다.
	land	가로 모드에 해당합니다.

이외에도 몇 가지 분류 방법이 더 있지만, 많이 쓰이는 것들만 정리해보았습니다.

프로젝트에 적용하기 위해서는 res폴더 아래에 제한자를 포함하여 폴더를 생성하시면 되며, 여러개의 제한자를 사용하여 생성하셔도 무방합니다. 각 제한자의 구분은 - 기호를 사용하시면 됩니다.

layout 폴더 생성 예

레이아웃 세분화의 장단점

위와 같이 레이아웃 세분화 시에 어떤 장단점이 있을까요?

저는 가장 큰 장점이라면 역시 이번 포스팅 주제인 여러 기기에 대응이 가능하다는 점이라고 생각합니다. 여러 기기의 화면이 다름에도 같은 비율의 이미지들과 글자들을 사용하여 핸드폰, 태블릿 등을 같은 화면처럼 표현 할 수도 있고, 또는 핸드폰과 태블릿 등을 구분하여 다르게 구성할 수도 있겠죠.

그럼 반대로 단점으로는 어떤 점이 있을까요?

사실 이 글을 쓰게 된 이유이기도 한 관리가 힘들다는 점이었습니다. 유지보수 또는 추가 기능 등으로 인해 레이아웃이 바뀌게 된다면 세분화되어있는 모든 레이아웃을 수정해야만 합니다. 생각만 해도 끔찍하시죠? 네 저도 그렇습니다...

해상도별 레이아웃 대응에 대한 고찰

여러기기에 대응하기 위해 레이아웃을 세분화하는 방법은 유지보수 및 관리적 측면에서 보았을 때, 너무 비효율적인 일이라고 생각됩니다. 하여, 레이아웃 작업을 최소화 할 수 있도록 하는 방법이 뭐가 있을까 생각하다가 찾은 것이 dimens.xml을 이용하는 방법인데요, 레이아웃은 하나로 통일시키고 dimens.xml을 세분화 하여 사용하는 방법입니다.

다음과 같이 레이아웃을 통일되게 꾸미고,

activity)main.xml

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

<LinearLayout 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"

android:gravity="center"

android:orientation="vertical"

tools:context="rebuild.com.layoutdimens.MainActivity">

<ImageView

android:layout_width="@dimen/imageWidth"

android:layout_height="@dimen/imageHeight"

android:background="@color/colorAccent" />

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginTop="@dimen/topMargin"

android:text="Dimens-!!"

android:textSize="@dimen/textSize" />

</LinearLayout>

dimens.xml은 레이아웃 세분화 할 때와 마찬가지로 생성하시면 되는데 이번에는 values폴더 안에 생성해주시면 되겠습니다.

dimens.xml

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

</resources>

이미지 사이즈 또는 텍스트 크기 등 기기의 해상도에 따라 변해야 하는 수치들을 각 해상도에 해당하는 dimens.xml에 정의하고 불러와 사용하도록 하였습니다.

이렇게 사용할 경우, 통합된 레이아웃을 사용하기 때문에 UI의 수정이 필요한 경우 레이아웃은 한번만 수정한 뒤, 각 해상도에 따라 dimens.xml에서 수치만 변경해주면 되기 때문에 유지보수 및 관리 측면에서 한결 간편하게 사용이 가능합니다.

제 개인적인 생각으로 정리해보았는데, 이게 꼭 정답이라는 말은 아닙니다.

좀 더 좋은 의견 있으시면 댓글 달아주시면 감사하겠습니다.!

[Android] FloatingActionButton 사용하기

여름숲_ — Mon, 15 Oct 2018 16:23:24 +0900

오늘 주제는 FloatingActionButton입니다.

뭔지 잘 모르시겠다구요? FloatingActionButton이 무엇인지, 어떻게 사용하는지 하나하나 설명 드릴테니, 잘 따라오시기바랍니다.

그럼 포스팅 시작하도록 하겠습니다.

FloatingActionButton 사용 예

앱을 사용하시다 보면 위와 같은 버튼을 보신 적 있으실 텐데요, 위의 버튼을 FloatingActionButton(이하 fab)이라고 합니다. 특히나 리스트뷰 같은 구조에서 많이 사용되는데요, 화면이 움직이더라도 fab 버튼은 화면의 최상위에 고정되어 떠있는 것을 보실 수 있습니다.

그럼 fab 버튼을 추가하고, 위의 사진에서처럼 서브 버튼이 나타났다가 사라지도록 구성하는 방법에 대해 예제를 통해 알아보도록 하겠습니다.

Gradle에 라이브러리 추가하기

FloationgActionButton은 Support Design Library에 소속되어 있으므로, Gradle에 라이브러리를 추가해주어야 합니다.

build.gradle (Module: app)

dependencies {

implementation 'com.android.support:design:26.1.0'

}

이제 fab버튼을 사용하실 수 있습니다. 이어서 MainActivity의 레이아웃을 구성하도록 하겠습니다.

레이아웃 작성하기

우선, 레이아웃부터 작성하도록 하겠습니다.

activity_main.xml

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

<RelativeLayout 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="rebuild.com.floatingactionbutton.MainActivity">

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_centerInParent="true"

android:text="숲속의 작은이야기 입니다.\nhttp://re-build.tistory.com"

android:textAlignment="center"

android:textColor="#000000"

android:textSize="20dp" />

<android.support.design.widget.FloatingActionButton

android:id="@+id/fab_sub1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_above="@+id/fab_sub2"

android:layout_alignParentRight="true"

android:layout_marginBottom="15dp"

android:layout_marginRight="20dp"

android:backgroundTint="#ffffff"

android:src="@drawable/ic_camera"

android:visibility="invisible"

app:borderWidth="0dp"

app:fabSize="normal" />

<android.support.design.widget.FloatingActionButton

android:id="@+id/fab_sub2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_above="@+id/fab_main"

android:layout_alignParentRight="true"

android:layout_marginBottom="15dp"

android:layout_marginRight="20dp"

android:backgroundTint="#ffffff"

android:src="@drawable/ic_map"

android:visibility="invisible"

app:borderWidth="0dp"

app:fabSize="normal" />

<android.support.design.widget.FloatingActionButton

android:id="@+id/fab_main"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentBottom="true"

android:layout_alignParentRight="true"

android:layout_marginBottom="20dp"

android:layout_marginRight="20dp"

android:backgroundTint="#009688"

android:src="@drawable/ic_add"

app:borderWidth="0dp"

app:fabSize="normal" />

</RelativeLayout>

우측 하단에 fab 버튼을 배치하고 버튼을 눌렀을 때, 나올 서브 fab 버튼들을 위쪽으로 배치했습니다. fab 버튼을 사용하실 때 많이 사용하게 되는 옵션들이 몇 가지 있습니다.

src

- fab 버튼의 아이콘을 지정할 수 있습니다.

backgroundTint

- fab 버튼의 색상을 변경 할 수 있습니다.

기본적으로 fab 버튼의 색상은 colors.xml에 정의된 colorAccent의 색상으로 지정되어있습니다.

fabSize

- fab버튼의 사이즈를 선택할 수 있습니다.

	"mini"	fab 버튼의 사이즈를 mini 사이즈로 지정합니다.
	"normal"	fab 버튼의 사이즈를 normal 사이즈로 지정합니다.
	"auto"	fab 버튼의 사이즈를 화면 사이즈에 맞추어 자동으로 mini 또는 normal롤 지정합니다.

borderWidth

- fab 버튼의 테두리 두께를 지정합니다.

이외의 다른 옵션들도 적용해보면서 어떤 효과를 내는지 알아두시면 좋을 것 같습니다.

애니메이션 정의하기

이어서 fab 버튼이 나타나고 사라지는 효과를 주기 위해 애니메이션을 만들어 보겠습니다.

fab_open.xml

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

<set xmlns:android="http://schemas.android.com/apk/res/android"

android:fillAfter="true">

<scale

android:duration="300"

android:fromXScale="0.0"

android:fromYScale="0.0"

android:interpolator="@android:anim/linear_interpolator"

android:pivotX="50%"

android:pivotY="50%"

android:toXScale="0.8"

android:toYScale="0.8" />

<alpha

android:duration="300"

android:fromAlpha="0.0"

android:interpolator="@android:anim/accelerate_interpolator"

android:toAlpha="1.0" />

</set>

fab_close.xml

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

<set xmlns:android="http://schemas.android.com/apk/res/android"

android:fillAfter="true">

<scale

android:duration="300"

android:fromXScale="0.8"

android:fromYScale="0.8"

android:interpolator="@android:anim/linear_interpolator"

android:pivotX="50%"

android:pivotY="50%"

android:toXScale="0.0"

android:toYScale="0.0" />

<alpha

android:duration="300"

android:fromAlpha="1.0"

android:interpolator="@android:anim/accelerate_interpolator"

android:toAlpha="0.0" />

</set>

애니메이션에 관한 내용은 다음 포스팅에서 다룰 예정이니 자세한 설명은 생략하도록 하겠습니다.

이제 모든 준비가 끝났으니, Activity에서 fab 버튼의 동작을 정의하도록 하겠습니다.

FloatingActionButton 사용하기

작성 된 애니메이션을 적용하여, fab 버튼의 동작을 정의하도록 하겠습니다.

MainActivity.java

package rebuild.com.floatingactionbutton;

import android.content.Context;

import android.os.Bundle;

import android.support.design.widget.FloatingActionButton;

import android.support.v7.app.AppCompatActivity;

import android.view.View;

import android.view.animation.Animation;

import android.view.animation.AnimationUtils;

import android.widget.Toast;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

private Context mContext;

private FloatingActionButton fab_main, fab_sub1, fab_sub2;

private Animation fab_open, fab_close;

private boolean isFabOpen = false;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

mContext = getApplicationContext();

fab_open = AnimationUtils.loadAnimation(mContext, R.anim.fab_open);

fab_close = AnimationUtils.loadAnimation(mContext, R.anim.fab_close);

fab_main = (FloatingActionButton) findViewById(R.id.fab_main);

fab_sub1 = (FloatingActionButton) findViewById(R.id.fab_sub1);

fab_sub2 = (FloatingActionButton) findViewById(R.id.fab_sub2);

fab_main.setOnClickListener(this);

fab_sub1.setOnClickListener(this);

fab_sub2.setOnClickListener(this);

}

@Override

public void onClick(View v) {

switch (v.getId()) {

case R.id.fab_main:

toggleFab();

break;

case R.id.fab_sub1:

toggleFab();

Toast.makeText(this, "Camera Open-!", Toast.LENGTH_SHORT).show();

break;

case R.id.fab_sub2:

toggleFab();

Toast.makeText(this, "Map Open-!", Toast.LENGTH_SHORT).show();

break;

}

private void toggleFab() {

if (isFabOpen) {

fab_main.setImageResource(R.drawable.ic_add);

fab_sub1.startAnimation(fab_close);

fab_sub2.startAnimation(fab_close);

fab_sub1.setClickable(false);

fab_sub2.setClickable(false);

isFabOpen = false;

} else {

fab_main.setImageResource(R.drawable.ic_close);

fab_sub1.startAnimation(fab_open);

fab_sub2.startAnimation(fab_open);

fab_sub1.setClickable(true);

fab_sub2.setClickable(true);

isFabOpen = true;

}

fab 버튼 클릭 시에 toggleFab() 메서드를 실행시켜 애니메이션 효과를 시작하도록 정의하였습니다. 어려운 내용은 없으니, 따라 해보신다면 바로 이해가 되실거라 생각 됩니다.

여기까지 하셨다면 실행시켜 결과를 확인해 보시면 되겠습니다.

간단하게 FloatingActionButton에 대해 알아보았는데요, 도움이 되셨나요?

요즘은 Fab 버튼이 많이 사라지고 있는 추세이긴 하나, 특정 상황에서는 꽤 쓸모 있게 사용이 가능한 유용한 기능입니다.

하나하나 알아둘수록 차후에 UI 설계등에서도 시야가 넓어지지 않을까요?ㅎ

이번 포스팅은 여기서 마치도록 하겠습니다. 읽어주셔서 감사합니다.

[Android] Custom EventListener 사용하기

여름숲_ — Tue, 2 Oct 2018 11:12:07 +0900

오늘 포스팅 주제는 커스텀 리스너 사용법에 관한 이야기 인데요, 일반적으로 사용하는 리스너 외에 원하는 형태와 상황에 맞추어 사용 가능하도록 커스텀 리스너를 생성하여 사용하는 법을 알아보고자 합니다.

Custom Listener 사용하기

이번 예제는 이전에 'Dialog 사용하기' 예제를 조금 수정하여 진행할 예정이기 때문에 예제를 따라하길 원하시는 분은 이전 포스팅의 내용을 먼저 작성하신 후에 보시면 되겠습니다.

Dialog 사용하기

http://re-build.tistory.com/27

예제에서는 MainActivity에서 Dialog의 버튼 클릭 이벤트에 대한 리스너를 달아, MainActivity에서 후 처리를 할 수 있도록 리스너를 구성해보도록 하겠습니다.

EndDialog.java

package rebuild.com.dialog;

import android.app.Dialog;

import android.content.Context;

import android.os.Bundle;

import android.support.annotation.NonNull;

import android.view.View;

import android.widget.TextView;

public class EndDialog extends Dialog implements View.OnClickListener {

private Context mContext;

private TextView btn_cancel;

private TextView btn_ok;

private OnDialogButtonClickListener mOnDialogButtonClickListener;

public interface OnDialogButtonClickListener {

void onDialogButtonClick(View view);

}

public void setOnDialogButtonClickListener(OnDialogButtonClickListener mListener) {

mOnDialogButtonClickListener = mListener;

}

public EndDialog(@NonNull Context context) {

super(context);

mContext = context;

}

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.dialog_end);

btn_cancel = (TextView) findViewById(R.id.btn_cancel);

btn_ok = (TextView) findViewById(R.id.btn_ok);

btn_cancel.setOnClickListener(this);

btn_ok.setOnClickListener(this);

}

@Override

public void onClick(View v) {

mOnDialogButtonClickListener.onDialogButtonClick(v);

}

소스만 보시고는 잘 이해가 되지 않으시겠죠?

먼저, EventListener를 인터페이스로 작성을 해주어야 합니다. 인터페이스 내에 작성되는 함수는 여러 개 생성하셔도 되며, 파라미터 또한 원하시는 데이터의 형태로 작성하시면 되겠습니다. 다만, 작성된 함수들은 인터페이스를 사용하는 클래스에 모두 구현이 되어야 하므로, 여러 클래스에서 사용하게 될 경우, 불필요하게 작성되지 않도록 주의해주시기 바랍니다.

인터페이스 작성이 모두 끝나셨다면, 작성된 인터페이스를 변수로 만들어주시면 됩니다. 이후에, 외부에서 인터페이스를 사용할 수 있도록 setEventListener(EventListener listener)를 달아주시면 됩니다.

설명하다 보니 글이 길어졌는데요. 간단하게 요약하면,

1. EventListener를 인터페이스로 정의한다.

2. 정의된 인터페이스를 변수로 선언한다.

3. setOnEvnetListener(EventListener listener)를 작성한다.

위의 예제에서는 다이얼로그의 버튼이 클릭 되었을 때, 인터페이스의 onDialogButtonClick() 함수에 View 정보를 넘겨주고 있습니다. 그럼 MainActivity에서 어떻게 처리를 해야 할지 보도록 하겠습니다.

MainActivity.java

package rebuild.com.dialog;

import android.content.Context;

import android.os.Bundle;

import android.support.v7.app.AppCompatActivity;

import android.view.View;

import android.widget.Button;

public class MainActivity extends AppCompatActivity implements View.OnClickListener, EndDialog.OnDialogButtonClickListener {

private Context mContext;

private Button btn_end;

private EndDialog mEndDialog;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

btn_end = (Button) findViewById(R.id.btn_finish);

btn_end.setOnClickListener(this);

}

@Override

public void onClick(View v) {

switch (v.getId()) {

case R.id.btn_finish:

mEndDialog = new EndDialog(this);

mEndDialog.setOnDialogButtonClickListener(this);

mEndDialog.setCancelable(false);

mEndDialog.show();

break;

}

@Override

public void onDialogButtonClick(View view) {

switch (view.getId()) {

case R.id.btn_cancel:

mEndDialog.dismiss();

break;

case R.id.btn_ok:

finish();

break;

}

다이얼로그 호출 시에 아까 만들었던 setEventListener를 통해 리스너를 등록해주시면 됩니다. 리스너를 등록하면, 인터페이스에 정의하였던 함수들을 Override해주어야 합니다. 여기에 후 처리들을 해주시면 되겠습니다.!

쓰다보니, 글이 길어진 것 같지만 소스를 작성해보시면 생각보다 간단하게 구현이 가능합니다. 프로젝트를 진행하다 보면 많이 사용하게 될 내용이라 프로젝트 구조 잡으실 때도 도움이 많이 되실 겁니다.

하마터면 열심히 살 뻔했다.

여름숲_ — Mon, 1 Oct 2018 17:33:08 +0900

세상은 우리에게 열정을 가지라고 강요하고 그 열정을 약점 잡아 이용하고 착취한다.

그래서 열정을 함부로 드러내는 건 위험하다. 이런 세상이라면 차라리 열정이 없는 편이 더 나을지도 모르겠다.

그럼에도 열정은 좋은 거다. 나를 위해 쓰기만 한다면 말이다.

내가 어떤 것에 열정을 쏟고 있다면 그 열정이 나를 위한 것인지, 남을 위한 건인지 잘 생각해볼 필요가 있다. 내가 알기론 열정이라는 것은 그렇게 자주 생기는 것도, 오래가는 것도 아니다. 열정을 막 쥐어 짜 내서도, 아무 데나 쏟아서도 안되는 이유가 여기에 있다.

열정도 닳는다. 함부로 쓰다 보면 정말 써야 할 때 쓰지 못하게 된다. 언젠가 열정을 쏟을 일이 찾아올 테고 그때를 위해서 열정을 아껴야 한다. 그러니까 억지로 열정을 가지려 애쓰지 말자.

그리고 내 열정은 내가 알아서 하게 가만 놔뒀으면 좋겠다. 강요하지 말고, 뺏어 가지 좀 마라. 좀!

<하마터면 열심히 살 뻔했다> 중에서