액션바에 아래와 같이 검색창을 넣을 수 있는데 이를 위해서는 3가지 작업이 필요하다.

1) menu xml에 SearchView item추가

    <item
        android:id="@+id⁄action_search"
 
        android:showAsAction="ifRoom"
        android:actionViewClass="android.widget.SearchView"
        android:title="@string⁄search"
       android:icon="@drawable⁄search"        
    ><⁄item>

2) onCreateOptionsMenu 에 search view 항목추가 및 Listener 설정

@Override public boolean onCreateOptionsMenu(Menu menu) { super.onCreateOptionsMenu(menu); MenuInflater inflater = getMenuInflater(); inflater.inflate(R.menu.activity_lost, menu); if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB_MR2) { searchItem = menu.findItem(R.id.action_search); searchView = (SearchView) searchItem.getActionView(); searchView.setQueryHint("물품명 또는 분류"); searchView.setOnQueryTextListener(queryTextListener); SearchManager searchManager = (SearchManager) getSystemService(Context.SEARCH_SERVICE); if(null!=searchManager ) { searchView.setSearchableInfo(searchManager.getSearchableInfo(getComponentName())); } searchView.setIconifiedByDefault(true); } return true; }

 

개발참고사이트 : http://developer.android.com/reference/android/widget/SearchView.html 

 setQueryHint(CharSequence)

 쿼리 필드가 비어있을 때 나타나는 문장 설정

 setOnQueryTextListener(SearchView.OnQueryTextListener listener)

 쿼리 변경시 사용자 액션의 listener 설정

setSearchableInfo(SearchableInfo searchable)  SearchableInfo 설정
 setIconifiedByDefault(boolean iconified)  검색창의 기본상태 설정
true : 필드가 보임
false : 아이콘으로 보임

3) 리스너에 처리로직 구현

	private OnQueryTextListener queryTextListener = new OnQueryTextListener() {
		@TargetApi(Build.VERSION_CODES.ICE_CREAM_SANDWICH)
		@Override
		public boolean onQueryTextSubmit(String query) {
			⁄⁄ TODO Auto-generated method stub
			⁄⁄searchItem.collapseActionView();
			⁄⁄Log.d(TAG,"onQueryTextSubmit");
			Cursor mCount= db.rawQuery("select count(*) from datainfo where GetName like '%" + query+"%' or cate like '%"+ query+"%'", null);
			mCount.moveToFirst();
			count= mCount.getInt(0);
			mCount.close();
			if(count <=0){
				Toast.makeText(LostActivity.con, "검색된 데이타가 없습니다.", Toast.LENGTH_LONG).show();
				return false;
			}
			datainfo = new DataInfo[count];
			Cursor result = db.rawQuery("SELECT * from datainfo where GetName like '%" + query+"%' or cate like '%"+ query+"%' order by GetDate desc", null);
			result.moveToFirst();	
			int i =0;
			while (i<count){
				datainfo[i] = new DataInfo();
				datainfo[i].SetLostId(result.getString(1));
				datainfo[i].SetLostName(result.getString(2));
				datainfo[i].SetLostURL(result.getString(3));
				datainfo[i].SetLostDate(result.getString(5));
				datainfo[i].SetLostTitle(result.getString(4));
				datainfo[i].SetTakePlace(result.getString(6));
				datainfo[i].SetTakeContact(result.getString(7));
				datainfo[i].SetLostPos(result.getString(9));
				datainfo[i].SetLostPlace(result.getString(10));
				datainfo[i].SetLostThing(result.getString(11));
				datainfo[i].SetLostStatus(result.getString(12));
				datainfo[i].SetLostImageUrl(result.getString(14));
				i++;
				result.moveToNext();
			}
			result.close();	
			appendRow(datainfo);
			resizeRow(count);
			⁄⁄Log.d(TAG,"onQueryTextSubmit"+count);
			imm= (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);
			imm.hideSoftInputFromWindow(searchView.getWindowToken(), 0);
			searchView.setQuery("", false);
			searchView.setIconified(true);
			⁄⁄Toast.makeText(LostActivity.con, "onQueryTextSubmit:["+count+"]", Toast.LENGTH_LONG).show();
			return false;
		}
		@Override
		public boolean onQueryTextChange(String newText) {
			// TODO Auto-generated method stub
			return false;
		}
	};

 

 

Lost_completed.zip

 

 

 

 

내가 지금까지 개발한 주차장앱,분실물찾기,지금 만들고 있는 공공WIFI앱에는 모두 액션바에 액션항목들이 하나씩 들어가 있습니다.

주차장앱에는 refresh 버튼이, 분실물찾기앱에는 search view, 공공WIFI앱에는 fixed tab과 swipe기능이 추가되었습니다.

이에 대한 이론적인 설명과 소스를 통한 예제를 통한 설명을 해보고자 합니다.

액션 항목(action item) : 액션바에서의 메뉴 혹은 버튼과 같은 뷰를 추가하여 사용자의 편의를 제공하는 UI

액션바와 메뉴 

액션바는 메뉴와 밀접한 관계가 있는데 안드로이드 3.0 이상이 탑재된 단말기의 경우 대부분 메뉴 버튼이 없습니다. 액션바는 다양한 역할을 담당하지만 주된 역할이 메뉴 버튼을 대신하는 것입니다. 따라서 액션바에 메뉴를 추가할 수 있습니다.

	<item 
	    android:id="@+id⁄menu_refresh"
		android:icon="@drawable⁄refresh11"
		android:title="@string⁄menu_refresh"
		android:showAsAction="ifRoom|withText" ⁄>

일반 메뉴 항목을 액션 아이템으로 표시되도록 하는 방법은 크게 두 가지입니다. 하나는 메뉴 XML을 사용하는 방법, 다른 하나는 코드로 구현하는 방법입니다. 두 가지 방법 모두 동일한 결과를 내는 데는 문제가 없지만, 코드를 통해 구현하는 경우 SDK 버전에 맞추어 별도로 코드를 작성해야 하므로 XML을 통해 설정하는 방법을 권장합니다.

ActionItem의 추가와 사용방법은 OptionMenu와 다르지 않습니다. 거의 똑같으나 showAsAction 속성만 추가되었습니다.

속성값은 아래와 같습니다.

 ActionItem showAsAction

never

 ActionBar에서는 보이지 않음

ifRoom   ActionBar에 공간이 있을경우 표시
always  ActionBar에 항상 표시
withText  ActionBar에 텍스트와 아이콘이 함께 표시


	⁄* (non-Javadoc)
	 * @see android.app.Activity#onOptionsItemSelected(android.view.MenuItem)
	 * 다시 api로 데이타 불러와 DB에 update하고 
	 * 화면에 update 표시한다.
	 *⁄
	@Override
	public boolean onOptionsItemSelected(MenuItem item) {
		⁄⁄ TODO Auto-generated method stub
		switch(item.getItemId()){
		case R.id.menu_refresh:
			Callhtml();
			calcDistance();
			refreshflag = true;
			updateDatainfo(datainfo);
			⁄** 계속 가끔 죽어서 원래 데이타 저장하도록해서 null이 리턴 되면 이전 데이타를 뿌려준다. *⁄
⁄⁄			System.arraycopy(datainfo, 0, datainfo2, 0, datacnt);
			datainfo2 = selectData();
⁄⁄			if(datainfo == null) System.arraycopy(datainfo2, 0, datainfo, 0, datacnt);
			if(datainfo2 == null) Log.d(TAG,"datainfo2 is null");
			appendHeader();
			appendRow(datainfo2);
			this.onWindowFocusChanged(true);
			break;
		}
		return super.onOptionsItemSelected(item);
	}
	
	⁄*
	 * (non-Javadoc)
	 * @see android.app.Activity#onCreateOptionsMenu(android.view.Menu)
	 * 메뉴를 parking이라는 메뉴로 설정한다.
	 *⁄
	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		⁄⁄ Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.parking, menu);
		return true;
	}

위와 같이 메뉴 항목이나 액션 항목을 선택했을 때 수행할 작업 구현은 기존과 동일하게 onOptionsItemSelected() 메서드에서 처리합니다.

SeoulParking_completed.zip

안드로이드 3.0, 허니컴(Honeycomb)에서는 태블릿 단말에 최적화된 컴포넌트들이 많이 추가되었는데, 프래그먼트(Fragment)와 함께 허니컴에서 추가된 대표적인 UI 컴포넌트 중 하나가 바로 액션바(Action bar)입니다.

기존 안드로이드 APP의 TitleBar가 단순한 제목의 표시나 간단한 정보만을 표시했다면 액션바는 아래와 같은 다양한 기능을 제공하며 4.0부터는 메뉴버튼까지 대체합니다.

 

 액션바의 주요기능

1) 타이틀바의 기능인 제목 표시 및 간단한 정보 표현

2) 사용자의 현재 위치 식별

3) 각종메뉴-탐색메뉴,액션항목을 통한 단축메뉴-제공

4) Navigation 지원

 

 액션바의 주요목적

1) APP의 이름,정보 와 사용자 위치 식별하기 위한 전용공간 제공

2) 다른 APP사의 일관된 네비게이션과 뷰의 세분화 제공

3) 검색,생성 공유와 같은 주요 액션에 대한 용이한 젭근 및 예측 가능 접근

 

 액션바의 주요UI

 

1. 앱 아이콘

: 애플리케이션 아이콘은 애플리케이션에 아이덴티티를 부여합니다. 원할 경우 다른 로고나 브랜드로 교체할 수도 있습니다. 중요: 만약 애플리케이션이 현재 최상위 화면을 표시하고 있지 않다면, 사용자가 상위 계층으로 이동할 수 있도록 애플리케이션 왼쪽에 상위 기호(Up caret)를 표시해야 합니다.

2. view control

: 만약 애플리케이션이 여러가지 뷰에서 데이터를 표시하고 있다면, 액션 바의 이 부분은 사용자가 뷰 간을 전활할 수 있도록 해줍니다. 뷰 전환 컨트롤에는 드롭다운 메뉴나 탭 컨트롤 등이 있습니다. 만약 애플리케이션이 여러가지 뷰를 지원하지 않는다면, 이 영역을 애플리케이션 타이틀이나 더 긴 브랜드 정보 등을 표시하는데 사용할 수도 있습니다.

 3. Action button

: 액션 섹션에서 애플리케이션의 중요한 액션들을 표시합니다. 액션 바에 들어갈 공간이 없는 액션들은 자동으로 액션 오버플로우 속으로 이동합니다.

4. Action overflow

: 덜 자주 사용하는 액션은 액션 오버플로우에 배치합니다.

 

 액션바의 사용시 주의사항

ActionBar, 액션바를 사용하기 위해서는 targetSdkVersion에 11 이상을 지정하셔야 합니다.

1
<uses-sdk android:targetSdkVersion="11" />



minSdkVersion은 하위 버전에 대한 호환을 고려하지 않을경우, 11이상으로 해두시면 됩니다.

이렇게 targetSdkVersion을 API 11이상으로 설정하시면, 자동적으로 액션바가 사용이 됩니다.

 

 Split action bar

안드로이드 4.0부터 split action bar라고 불리는 추가적인 모드를 사용할 수 있다. 분할 액션바를 사용하면 화면 하단에 별도의 bar가 보이며, 좁은 화면에서 액티비티가 실행되더라도 모든 액션 항목을 보여준다. 액션바를분할하여 액션 항목을 분리하는 것은 상단에 내비게이션과 타이틀 요소를 남겨둔 채로 좁은 화면에서 합리적인 공간을 사용하여 모든 액션 항목을 표시한다. 그리고 다양한 기기의 화면 크기와 화면 회전에 고려한 APP을 만들 때 중요한 UI입니다.

분할 액션바를 활성화하려면 uiOptions="splitActionBarWhenNarrow"를 매니페스트 파일의 <activity> 혹은 <application> 엘리먼트에 추가하면 됩니다.

 

1. 메인 액션바

2. 상단바

3. 하단바

사용자가 빠르게 애플리케이션에서 제공하는 뷰 간을 전환할 수 있도록, 상단 바에 탭이나 스피너를 배치하고 액션과 액션 오버 플로우를 표시하려면 하단 바를 배치하는 방법이 유용한 UI가 될 수 있습니다.

 

아직 split action bar는 사용을 해보지 못해서 이론적인 부분만 추가해 두었습니다.

+ Recent posts