You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

MaterialComponents中AppCompat.Button.Borderless替代方案及UI问题咨询

Hey there! Let's tackle your two issues one by one now that you've switched to Material Components:

1. Replacing AppCompat.Button.Borderless in Material Components

When you switch your app theme to Theme.MaterialComponents.*, the default Button class gets replaced with com.google.android.material.button.MaterialButton automatically. That's why your old AppCompat-based borderless button style stopped working—Material Button uses its own style hierarchy instead of AppCompat's.

The perfect replacement for Base.Widget.AppCompat.Button.Borderless is Widget.MaterialComponents.Button.TextButton (this is the Material Components equivalent of a borderless, text-only button). Here's how to update your style:

<style name="ButtonBorderless" parent="Widget.MaterialComponents.Button.TextButton">
    <item name="android:minHeight">0dp</item>
    <item name="android:minWidth">0dp</item>
    <item name="android:textSize">14sp</item>
    <!-- Optional tweaks to match your original look: -->
    <item name="android:paddingTop">0dp</item>
    <item name="android:paddingBottom">0dp</item>
    <item name="rippleColor">@android:color/transparent</item> <!-- Remove default ripple if needed -->
</style>

If you want an explicit "borderless" variant (though TextButton is already borderless), you can also use Widget.MaterialComponents.Button.TextButton.Borderless as the parent—both work, but TextButton is the more standard choice in Material Design.

2. Fixing the "WE" ToggleButton Text Truncation

Looking at your layout code, the Wednesday toggle button has a fixed width of 45dp with 8dp of horizontal padding, leaving only 45dp - 8dp*2 = 29dp of space for the "WE" text. Combined with 16dp text size (note: you should use sp for text instead of dp to respect system font settings!), this is causing the truncation.

Here are a few fixes you can apply (pick the combination that works best for your UI):

Option 1: Adjust Width and Padding

Give the button a bit more width and reduce padding to free up space for the text:

<ToggleButton android:id="@+id/toggleWednesday"
    android:layout_width="50dp" <!-- Increased from 45dp -->
    android:layout_height="45dp"
    android:layout_marginLeft="8dp"
    android:layout_marginRight="8dp"
    android:background="@drawable/selector_day_toggle"
    android:gravity="center"
    android:padding="4dp" <!-- Reduced from 8dp -->
    android:textColor="@color/selector_day_text"
    android:textOff="WE"
    android:textOn="WE"
    android:textSize="14sp" <!-- Switched to sp, reduced size slightly -->
    android:includeFontPadding="false" <!-- Removes extra font padding -->
/>

Option 2: Explicitly Force Single Line Text

Ensure the button doesn't wrap text (this is usually default, but adding it explicitly can help prevent edge cases):

<item name="android:singleLine">true</item>

Option 3: Use a Condensed Font

If you want to keep the original size and width, consider using a condensed variant of your app's font (if available) to fit "WE" into the limited space.


Quick side note: If you ever need to use AppCompat components alongside Material Components, you can explicitly reference them in your layout (e.g., androidx.appcompat.widget.AppCompatButton instead of Button), but it's better to stick with Material Components widgets to maintain theme consistency.

内容的提问来源于stack exchange,提问作者Priyanka Singh

火山引擎 最新活动