tiper / MaterialSpinner

Implementation of a Material Spinner for Android with TextInputLayout functionalities
Apache License 2.0
130 stars 30 forks source link

Typeface for spinner's hint, floating label and ... #28

Open alisoleimani-android opened 4 years ago

alisoleimani-android commented 4 years ago

Hi, thanks for this great library. I'm going to set typeface for hint, floating label and selected item but i don't know how!. I found the custom adapter solution for list items but for hint, floating label and etc. i couldn't figure it out. I'll be appreciated if you give me some advice or better solution.

Here's my custom adapter :

`public class SpinnerAdapter extends ArrayAdapter {

private final LayoutInflater mInflater;
private final List<String> items;
private final int mResource;

public SpinnerAdapter(@NonNull Context context, @LayoutRes int resource,
                      @NonNull List<String> items) {
    super(context, resource, 0, items);

    mInflater = LayoutInflater.from(context);
    mResource = resource;
    this.items = items;
}

@Override
public View getDropDownView(int position, @Nullable View convertView,
                            @NonNull ViewGroup parent) {
    return createItemView(position, parent);
}

@Override
public @NonNull
View getView(int position, @Nullable View convertView, @NonNull ViewGroup parent) {
    return createItemView(position, parent);
}

private View createItemView(int position, ViewGroup parent) {
    TextView tv = (TextView) mInflater.inflate(mResource, parent, false);
    tv.setText(items.get(position));
    return tv;
}

}`

Thank you

yrajabi commented 4 years ago

@asr1994 Hi, you could use tv.setTypeface() in your adapter to change typeface of list items, and below lines to apply typeface on spinner hint and floating label: spinner.setTypeface(typeface); spinner.getEditText().setTypeface(typeface);

Generally it is better to use something like InflationX.Calligraphy library to apply custom fonts across your app easily.

tiper commented 4 years ago

Hi @asr1994, thanks for the support.

MaterialSpinner is based on TextInputLayout, so you can perform the same level of customization creating and applying a style to it.

Please consider taking a look at the TextInputLayout documentation. Although this widget is still based on the android support libs (for compatibility with older projects) most of the documentation still applies. And worry not, if you're using AndroidX jetifier will ensure this widget will use the AndroidX libs instead of the older ones.

Hope this helps and let me know if there's anything else I can help you.

MasoudFallahpour commented 3 years ago

I'm using Calligraphy to use a custom font all over my app. All widgets like TextInputLayouts, Buttons, etc. use the custom font but MaterialSpinner ignores the custom font.

AlfredAbdo commented 3 years ago

I'm using Calligraphy to use a custom font all over my app. All widgets like TextInputLayouts, Buttons, etc. use the custom font but MaterialSpinner ignores the custom font.

Since custom fonts can be declared in style/themes using the appcompat version, and since the Material Components allow you to declare a default style for almost every text view or text view parent, I switched from Calligraphy to just adding all the necessary styles, and using fontFamily.

So, as a result, I decided to add a custom style resource for the MaterialSpinner in my case, so the constructor now looks like this:

open class MaterialSpinner @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyleAttr: Int = R.attr.materialSpinnerStyle,//com.google.android.material.R.attr.textInputStyle,
    mode: Int = MODE_DROPDOWN
) : TextInputLayout(context/*super(wrap(context, attrs, defStyleAttr, 0))*/, attrs, defStyleAttr) {

I always the style declared in my app's theme, as such:

<item name="materialSpinnerStyle">@style/MaterialSpinnerStyle</item>
<style name="MaterialSpinnerStyle" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
    <item name="contentStyle">@style/TextInputEditTextStyle</item>
</style>

As you probably noticed, the commented out code is trying to imitate what the Material Components version of TextInputLayout does for its child TextInputEditText. but it unfortunately did not work for me (yes, even trying to use the same overlay logic in themes). I ended up adding a new attribute for the edittext itself: the contentStyle attribute in my version above.

private val editText: TextInputEditText by lazy {
        editTextStyle?.let { TextInputEditText(ContextThemeWrapper(context, it), null, 0) }
            ?: TextInputEditText(getContext())
}

(editTextStyle is the resolved version of the contentStyle attribute, which I handle not being declared by using the default implementation).