안드로이드 커스텀 제목 구현 방법

안드로이드 애플리케이션을 개발할 때 기본적으로 제공되는 시스템 제목 스타일은 단조로울 수 있습니다. 이번 글에서는 앱의 제목 영역을 완전히 커스터마이징하여 더 세련된 디자인을 구현하는 방법을 소개합니다. 시스템 기본 스타일보다 훨씬 더 창의적인 디자인이 가능하며, 이를 통해 사용자에게 더 나은 시각적 경험을 제공할 수 있습니다. 바로 시작해 보겠습니다:

  1. 커스텀 제목을 구현하기 위해서는 먼저 제목 레이아웃 파일을 설계해야 합니다. 이 레이아웃 파일을 통해 자유롭게 제목 디자인을 구성할 수 있습니다 (custom_title_layout.xml):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:gravity="center_vertical">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_logo"
        android:layout_marginRight="10dp"/>
    
    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:textColor="#ffffff"
        android:textSize="18sp"
        android:text="커스텀 앱 제목" 
        android:gravity="center"/>
        
    <Button 
        android:id="@+id/action_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="메뉴"
        android:textColor="#ffffff"/>

</LinearLayout>
  1. 레이아웃 파일을 준비했으니, 이제 제목 스타일을 설정해 보겠습니다. 프로젝트의 res 디렉토리에 있는 styles.xml 파일을 수정합니다:
<resources>

    <style name="customAppTheme" parent="android:Theme">
         <item name="android:windowContentOverlay">@color/transparent</item>
         <item name="android:windowTitleSize">50dp</item>
         <item name="android:windowTitleBackgroundStyle">@style/customTitleBackground</item>
    </style>
    
    <style name="customTitleBackground">
        <item name="android:background">@drawable/title_background</item>
    </style>

</resources>
  1. 스타일에서 지정한 빨간색 부분은 drawable 디렉토리의 title_background.xml 파일로 제목 배경을 구현한 것입니다:
<?xml version="1.0" encoding="utf-8"?>
<shape 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <gradient
        android:angle="90"
        android:endColor="#6A11CB"
        android:startColor="#2575FC" />
    <corners
        android:radius="5dp" />
    <stroke
        android:width="1dp"
        android:color="#0D47A1" />
</shape>
  1. 이제 메인 액티비티 코드를 수정하여 커스텀 제목을 적용해 보겠습니다:
public class CustomTitleActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        
        requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);

        setContentView(R.layout.main_activity);
        
        getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.custom_title_layout);
        
        Button menuButton = (Button)findViewById(R.id.action_button);
        menuButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(CustomTitleActivity.this, "기능은 준비 중입니다", Toast.LENGTH_SHORT).show();
            }
        });
    }
}

주의할 점은 빨간색으로 표시된 부분이 레이아웃 파일을 참조하기 전에 반드시 호출되어야 한다는 것입니다. 그렇지 않으면 원하는 결과를 얻을 수 없습니다.

  1. 마지막으로 AndroidManifest.xml 파일에서 액티비티에 스타일을 적용해야 합니다:
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.customtitleapp"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="15"
        android:targetSdkVersion="30" />

    <application
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name">
        <activity
            android:name=".CustomTitleActivity" 
            android:theme="@style/customAppTheme">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

이제 안드로이드 앱에서 커스텀 제목을 구현하는 방법에 대한 모든 단계를 마쳤습니다. 이 기술을 활용하여 앱의 전반적인 사용자 인터페이스를 개선할 수 있습니다.

태그: 안드로이드 커스텀제목 UI디자인 앱개발

5월 25일 07:20에 게시됨