아이콘 글꼴을 사용하여 버튼의 drawable Left/Right에 그림을 설정하는 방법(Iconics 편)

개요

아이콘 글씨체가 편리하네요!
아이콘 글꼴을 사용하여 문자에 아이콘 이미지를 표시할 수 있습니다.
아이콘+텍스트 버튼 등을 간단하게 만들 수 있다는 것이다.
그러나 하나의 요소로 표시되기 때문에 문자와 아이콘이 서로 다른 사이즈를 사용할 수 없고 아이콘과 문자의 기준선도 통일될 수 있다는 문제가 있다.
Android 버튼은 drawableLeft 및 drawableRight 속성을 사용하여 버튼에 아이콘을 표시할 수 있습니다.
이 속성을 사용하면 이전의 문제를 해결할 수 있지만 그림을 지정해야 하기 때문에 직접 사용할 수 없습니다.
따라서 아이콘 글꼴을drawable vector로 변환하여 아이콘으로 표시하는 방법을 소개한다.
아이콘 글꼴을 사용하는 프로그램 라이브러리 Iconics.

결실

아래drawableicon_font_left 속성을 지정하면 아이콘이 잘 표시됩니다.

<Button
    android:text="{faw-android} android"
    />
<Button
    android:text="android"
    app:drawable_icon_font_left="@{`faw_android`}"
    />

구조

Iconics 설치 및 데이터 빙딩의 유효성

build.gradle에 다음 설정을 추가합니다.여기서 예를 들어 AwesomeFont을 사용해 보세요.

android {
    ...
    dataBinding {
        enabled = true
    }
}

dependencies {
    ...
    compile "com.mikepenz:iconics-core:2.8.2@aar"
    compile 'com.mikepenz:fontawesome-typeface:4.7.0.0@aar'
}

Iconics의 유효성

사용된 Activity 및 Fragment에 다음 설정을 추가합니다.

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        LayoutInflaterCompat.setFactory(getLayoutInflater(), new IconicsLayoutInflater(getDelegate()));

        super.onCreate(savedInstanceState);
        DataBindingUtil.setContentView(this, R.layout.activity_main);
    }
}

BindingAdapter 정의

drawable_icon_font_left 속성을 정의합니다.
메서드에서는 지정된 문자에 따라 Drawable을 생성합니다.
이 때 사용자의 취향에 따라 텍스트 색과 같은 색을 설정할 수도 있고 아이콘 크기가 텍스트 크기보다 조금 큰 색을 설정할 수도 있습니다.

public class BindingAdapterManager {

    @BindingAdapter("drawable_icon_font_left")
    public static void setDrawableIconFontLeft(final Button button, final String icon) {
        final Context context = button.getContext();
        final IconicsDrawable iconicsDrawable = new IconicsDrawable(context)
                .icon(FontAwesome.Icon.valueOf(icon))
                .color(button.getCurrentTextColor())
                .sizePx((int)(button.getTextSize() * 1.25));
        button.setCompoundDrawables(iconicsDrawable, null, null, null);
    }
}

견본

Drawable-Icon-Font@github에 실행할 항목이 있습니다.

감사의 말

이 팁스는'스마트폰 사진 소재를 판매할 수 있는 사이트Snapmart'를 개발하는 과정에서 탄생했다.
안드로이드 버전이 개발 중이어서 아직 사용할 수 없어서 유감입니다.
아이폰이 있는 사람은 반드시 다운로드해서 사용하세요!
Snapmart 애플리케이션(iOS)