Android SDK 테마 및 사용자 정의 설정 구성 방법
1. 기존 테마 중 하나 선택하기
Chat SDK는 하위 호환성을 제공하기 위해 appcompat-v7에 의존하므로, 모든 채팅 테마는 Theme.AppCompat.* 테마에서 상속됩니다. 채팅 SDK 구성 요소에 적용된 테마를 변경하려면 앱의 styles.xml에서 Theme.Freshchat.SelectedTheme의 부모를 Theme.Freshchat.*의 변형 중 하나로 변경하십시오.
예시:
<style name="Theme.Freshchat.SelectedTheme" parent="@style/Theme.Freshchat.Light.DarkActionBar" />
Chat SDK는 Theme.Freshchat.Light 및 Theme.Freshchat.Light.DarkActionBar와 함께 제공됩니다.
2. 사용자 정의 테마 생성 및 적용하기
Chat SDK의 테마는 Android 테마 시스템 위에 구축되어 있으며, 따라서 ActionBar 배경색, ActionBar 텍스트 색상, 상태 표시줄 색상 등과 같은 표준 Android 테마 속성을 지원합니다. Android 디자인 가이드 참조: Android Material Theme Attributes
예를 들어, colorPrimary를 사용자 정의하려면 다음을 포함하십시오.
<item name="colorPrimary">@color/my_awesome_color</item>
다음은 Freschat SDK에 특정한 사용자 정의 목록입니다.
2.1 텍스트 모양
Chat SDK는 SDK의 여러 요소에 대한 텍스트 모양 변경을 지원합니다. 기본 텍스트 모양 구현은 여기에서 참조할 수 있습니다: Default Styles
참고: *나열된 TextStyles는 일반적으로 텍스트 뷰에 대한 표준 Android 뷰 스타일이며, 따라서 textAppearance는 textColor, textSize 등과 같은 사용자 정의를 포함할 수 있습니다.
텍스트 모양 사용자 정의 단계
단계 1: 사용자 정의 텍스트 모양을 스타일로 정의하기
예를 들어, MyCustomTextAppearance 스타일은 다음과 같이 정의됩니다.
<style name="MyCustomTextAppearance" parent="TextAppearance.AppCompat.Medium">
<item name="android:textColor">@color/textColorPrimary</item>
<item name="android:textColorHighlight">@color/textColorHighlight</item>
<item name="android:textColorHint">@color/textColorHint</item>
<item name="android:textColorLink">@color/textColorLink</item>
<item name="android:textSize">16sp</item>
<item name="android:textStyle">bold</item>
</style>
단계 2: 텍스트 모양 스타일을 미리 정의된 채팅 textAppearance 사용자 정의 속성에 매핑하기.
예를 들어, 위에서 정의한 MyCustomTextAppearance 스타일은 스타일 freshchatChannelNameTextStyle의 텍스트 모양입니다.
<style name="MyCustomTheme" parent="Theme.Freshchat.Light.DarkActionBar">
<item name="freshchatChannelNameTextStyle">@style/CustomChannelNameTextStyle</item>
</style>
<style name="CustomChannelNameTextStyle" parent="Widget.Freshchat.ChannelName">
<item name="android:textAppearance">@style/MyCustomTextAppearance</item>
</style>
단계 3: 모든 채팅 SDK 활동에 사용자 정의 테마 설정하기. 가장 간단한 방법은 앱의 styles.xml / themes.xml에서 Theme.Freshchat.SelectedTheme의 부모를 재정의하고 설정하는 것입니다.
<style name="Theme.Freshchat.SelectedTheme" parent="MyCustomTheme" />
또는 각 활동에 대해 다른 테마를 적용하려면 앱의 AndroidManifest.xml에 활동 항목을 포함하고 거기서 테마를 재정의하십시오.
예를 들어, android:theme 및 tools:replace 속성을 포함하여 매니페스트 병합기로 테마를 대체할 수 있도록 합니다.
채팅 SDK 활동 목록은 다음을 참조하십시오: Chat Android SDK Manifest
<activity
android:name="com.freshchat.consumer.sdk.activity.ChannelListActivity"
android:theme="@style/MyCustomTheme"
tools:replace="android:theme" />
<activity
android:name="com.freshchat.consumer.sdk.activity.ConversationDetailActivity"
android:theme="@style/MyAlternateTheme"
tools:replace="android:theme" />
2.2 뷰 모양 사용자 정의
Chat SDK는 다음 뷰의 모양을 사용자 정의할 수 있습니다. 뷰가 텍스트 컨테이너 뷰인 경우, 텍스트 모양도 스타일의 일부로 사용자 정의할 수 있습니다.
freshchatChannelNameTextStyle -> 채널 이름 뷰의 스타일
freshchatChannelDescriptionTextStyle -> 채널 설명 뷰의 스타일
freshchatChannelLastUpdatedAtTextStyle -> 채널 마지막 업데이트 시간 뷰의 스타일
freshchatChannelUnreadCountTextStyle -> 채널 읽지 않은 메시지 수 뷰의 스타일
freshchatChannelListStyle -> 채널 목록 뷰 스타일
freshchatChannelListItemStyle -> 목록의 각 채널에 대한 스타일
freshchatChannelAltIconStyle -> 아이콘이 없을 때 채널 아이콘의 대체 뷰 스타일
freshchatTeamMemberNameTextStyle -> 팀 멤버 이름 뷰의 스타일
freshchatUserMessageTextStyle -> 사용자 메시지 뷰의 스타일
freshchatTeamMemberMessageTextStyle -> 팀 멤버 메시지 뷰의 스타일
Style for team member message view freshchatUserMessageTimeTextStyle -> 사용자 메시지 시간 보기 스타일 freshchatTeamMemberMessageTimeTextStyle -> 팀원 메시지 시간 보기 스타일 freshchatMessageListStyle -> 메시지 목록 보기 스타일 freshchatMessageListItemStyle -> 메시지 목록의 각 항목 스타일 freshchatMessageButtonStyle -> 메시지 내 버튼 스타일 freshchatMessageReplyInputViewStyle -> 사용자 메시지 입력 편집 텍스트 필드 스타일 freshchatConversationBannerMessageStyle -> 대화 세부/메시지 목록 화면 상단의 배너 보기 스타일 freshchatFAQCategoryListStyle -> FAQ 카테고리 목록 보기 스타일 freshchatFAQCategoryListItemStyle -> 목록 내 각 FAQ 카테고리 스타일 freshchatFAQCategoryAltIconStyle -> 아이콘이 구성되지 않았을 때 카테고리 아이콘의 대체 보기 스타일 freshchatFAQCategoryNameTextStyle -> FAQ 카테고리 이름 보기 스타일 freshchatFAQCategoryDescriptionTextStyle -> FAQ 카테고리 설명 보기 스타일 freshchatFAQListEmptyTextStyle -> FAQ 목록 빈 보기 스타일 freshchatFAQListStyle -> FAQ / 기사 목록 보기 스타일 freshchatFAQListItemStyle -> FAQ / 기사 목록의 각 항목 스타일 freshchatFAQVotingPromptTextStyle -> FAQ 투표 프롬프트 텍스트뷰 스타일 freshchatFAQVotingPromptViewStyle -> FAQ 투표 프롬프트 보기 스타일 freshchatFAQUpvoteButtonStyle -> FAQ 투표 프롬프트의 찬성 버튼 스타일 freshchatFAQDownvoteButtonStyle -> FAQ 투표 프롬프트의 반대 버튼 스타일 2.3 사용자 정의 폰트 채팅은 Calligraphy를 통해 사용자 정의 폰트를 지원합니다. 앱의 build.gradle에 다음 줄을 추가하여 Calligraphy를 종속성으로 포함하십시오. HTML dependencies { compile 'uk.co.chrisjenx:calligraphy:2.1.0'} 앱 모듈의 /assets 폴더에 폰트 파일(*.ttf)을 추가하십시오. 각 보기에 대해 다른 폰트를 적용하려면, 2.1절에 설명된 Hotline textAppearance 속성의 일부로 fontPath 속성을 지정하십시오. 예를 들어, 2.1단계 1에서 정의된 MyCustomTextAppearance 스타일에도 fontPath 속성이 포함될 것입니다. XML