brunch

빠르게 배우는 안드로이드 -14 GridView

ListView에서 GridView로 변경해보자

by 윤형도


위 강의에 이어서 진행하도록 하겠습니다.


리스트뷰가 한줄에 한개씩 표시하는 위젯이라면 그리드뷰는 한줄에 여러개를 표시하는 위젯입니다.

listView를 GridView 위젯으로만 바꾸면 별다른 조치없이 동작하게됩니다.

1*f16YzUPHiZvy4KhkD4lqqA.png

에서 오른쪽 Component Tree에서 listview를 오른쪽으로 클릭후
Morphing-> GridView를 누르면 손쉽게 변경됩니다.

1*OWGXp5a-T9CJX93VJnhLbw.png

이제 코드에서 ListView listView를 GridView listView로 변경합니다

listView = (GridView)findViewById(R.id.my_listView);

부분도 GridView를 ListView로 변경합니다

listView = (ListView)findViewById(R.id.my_listView);



public class MainActivity extends AppCompatActivity {
GridView listView;
MyListAdapter myListAdapter;
ArrayList<list_item> list_itemArrayList;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
list_itemArrayList = new ArrayList<list_item>();
listView = (GridView)findViewById(R.id.my_listView);
String temp ="https://cdn-images-1.medium.com/fit/c/36/36/0*HgJ2Psmia7PjQsp9.jpg";

list_itemArrayList.add(new list_item("https://cdn-images-1.medium.com/fit/c/36/36/0*HgJ2Psmia7PjQsp9.jpg","보라돌이","제목1",new Date(System.currentTimeMillis()),"내용1"));
list_itemArrayList.add(new list_item("https://cdn-images-1.medium.com/fit/c/36/36/0*HgJ2Psmia7PjQsp9.jpg","뚜비","제목2",new Date(System.currentTimeMillis()),"내용2"));
list_itemArrayList.add(new list_item("https://cdn-images-1.medium.com/fit/c/36/36/0*HgJ2Psmia7PjQsp9.jpg","나나","제목3",new Date(System.currentTimeMillis()),"내용3"));
list_itemArrayList.add(new list_item("https://cdn-images-1.medium.com/fit/c/36/36/0*HgJ2Psmia7PjQsp9.jpg","뽀","제목4",new Date(System.currentTimeMillis()),"내용4"));
list_itemArrayList.add(new list_item("https://cdn-images-1.medium.com/fit/c/36/36/0*HgJ2Psmia7PjQsp9.jpg","햇님","제목5",new Date(System.currentTimeMillis()),"내용5"));




myListAdapter = new MyListAdapter(MainActivity.this,list_itemArrayList);
listView.setAdapter(myListAdapter);
listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Toast.makeText(MainActivity.this ,list_itemArrayList.get(position).getNickname(),Toast.LENGTH_LONG).show();
}
});




}
}


전체 코드가 이렇게 변경되었습니다.

이제 실행을 해보겠습니다

1*2SMXsTxaZYNVk6IEXZ-uCw.png

별다른 변화가 없어 보입니다.

numColumns 라는 속성을 아직 지정해주지 않았기 때문에 기본값이 1이어서 이렇게 나타나는 것입니다.

xml 부분으로 가서 numColumns를 2로 변경해봅니다

다음과 이 2열이 생긴것을 볼수있습니다.

이제 다시 프로젝트를 애뮬레이터로실행해봅니다.

1*2uxuCZ4WWqG-3ObJ1F2gtw.png

위와 같이 2열로 리스트가 생기는것을 볼수있습니다.

클릭도 해보겠습니다. 코드를 수정하지않았는데도 onItemClick이 정상적으로 동작하는것을 볼수있습니다.

1*GdIqsmY01nyIeXmYgt3wzQ.png



keyword
매거진의 이전글빠르게 배우는 안드로이드 -13  ListView-4