Как центрировать значок и текст в кнопке андроида с шириной, заданной как "заполнить родительский элемент",
Я хочу иметь кнопку Android со значком + текст, центрированный внутри него. Я использую атрибут drawableLeft для установки изображения, это хорошо работает, если кнопка имеет ширину "wrap_content"
, но мне нужно растягиваться до максимальной ширины, поэтому я использую ширину "fill_parent"
. Это перемещает мой значок прямо слева от кнопки, и я хочу, чтобы иконка и текст были центрированы внутри кнопки.
Я попытался настроить заполнение, но это только позволяет дать фиксированное значение, так что это не то, что мне нужно. Мне нужно, чтобы значок + текст выровнялся по центру.
<Button
android:id="@+id/startTelemoteButton"
android:text="@string/start_telemote"
android:drawableLeft="@drawable/start"
android:paddingLeft="20dip"
android:paddingRight="20dip"
android:width="fill_parent"
android:heigh="wrap_content" />
Любые предложения о том, как я могу это достичь?
Ответы
Ответ 1
android: drawableLeft всегда поддерживает android: paddingLeft как расстояние от левой границы. Когда кнопка не установлена на android: width = "wrap_content", она всегда будет висела слева!
В Android 4.0 (API-уровень 14) вы можете использовать атрибут android: drawableStart, чтобы поместить выталкиваемый текст в начале текста. Единственное обратное совместимое решение, которое я придумал, - это ImageSpan, чтобы создать текстовое изображение + изображение:
Button button = (Button) findViewById(R.id.button);
Spannable buttonLabel = new SpannableString(" Button Text");
buttonLabel.setSpan(new ImageSpan(getApplicationContext(), R.drawable.icon,
ImageSpan.ALIGN_BOTTOM), 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
button.setText(buttonLabel);
В моем случае мне также нужно было настроить атрибут android: gravity Button, чтобы он выглядел по центру:
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minHeight="32dp"
android:minWidth="150dp"
android:gravity="center_horizontal|top" />
Ответ 2
Я знаю, что опаздываю, отвечая на этот вопрос, но это помогло мне:
<FrameLayout
android:layout_width="match_parent"
android:layout_height="35dp"
android:layout_marginBottom="5dp"
android:layout_marginTop="10dp"
android:background="@color/fb" >
<Button
android:id="@+id/fbLogin"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:background="@null"
android:drawableLeft="@drawable/ic_facebook"
android:gravity="center"
android:minHeight="0dp"
android:minWidth="0dp"
android:text="FACEBOOK"
android:textColor="@android:color/white" />
</FrameLayout>
Я нашел это решение отсюда: Android UI борется: создание кнопки с центрированным текстом и значком
![enter image description here]()
Ответ 3
Я использовал LinearLayout вместо Button. OnClickListener, который мне нужно использовать, отлично работает и для LinearLayout.
<LinearLayout
android:id="@+id/my_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/selector"
android:gravity="center"
android:orientation="horizontal"
android:clickable="true">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="15dp"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:src="@drawable/icon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Text" />
</LinearLayout>
Ответ 4
Недавно я столкнулся с той же проблемой. Пытался найти более дешевое решение, поэтому придумал это.
<LinearLayout
android:id="@+id/linearButton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/selector_button_translucent_ab_color"
android:clickable="true"
android:descendantFocusability="blocksDescendants"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="@string/app_name"
android:src="@drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/app_name"
android:textColor="@android:color/white" />
</LinearLayout>
Затем просто вызовите OnClickListener
на LinearLayout
.
Надеюсь, это поможет кому-то, поскольку это кажется очень распространенной проблемой.:)
Ответ 5
Я настраиваю его, добавляя добавление влево и вправо следующим образом:
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="@+id/btn_facebookact_like"
android:text="@string/btn_facebookact_like"
android:textColor="@color/black"
android:textAllCaps="false"
android:background="@color/white"
android:drawableStart="@drawable/like"
android:drawableLeft="@drawable/like"
android:gravity="center"
android:layout_gravity="center"
android:paddingLeft="40dp"
android:paddingRight="40dp"
/>
Ответ 6
Вы можете использовать пользовательскую кнопку, которая измеряет и рисует, чтобы разместить левую выделенную. Пример и использование здесь
public class DrawableAlignedButton extends Button {
public DrawableAlignedButton(Context context, AttributeSet attrs) {
super(context, attrs);
}
public DrawableAlignedButton(Context context) {
super(context);
}
public DrawableAlignedButton(Context context, AttributeSet attrs, int style) {
super(context, attrs, style);
}
private Drawable mLeftDrawable;
@Override
//Overriden to work only with a left drawable.
public void setCompoundDrawablesWithIntrinsicBounds(Drawable left,
Drawable top, Drawable right, Drawable bottom) {
if(left == null) return;
left.setBounds(0, 0, left.getIntrinsicWidth(), left.getIntrinsicHeight());
mLeftDrawable = left;
}
@Override
protected void onDraw(Canvas canvas) {
//transform the canvas so we can draw both image and text at center.
canvas.save();
canvas.translate(2+mLeftDrawable.getIntrinsicWidth()/2, 0);
super.onDraw(canvas);
canvas.restore();
canvas.save();
int widthOfText = (int)getPaint().measureText(getText().toString());
int left = (getWidth()+widthOfText)/2 - mLeftDrawable.getIntrinsicWidth() - 2;
canvas.translate(left, (getHeight()-mLeftDrawable.getIntrinsicHeight())/2);
mLeftDrawable.draw(canvas);
canvas.restore();
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int height = getMeasuredHeight();
height = Math.max(height, mLeftDrawable.getIntrinsicHeight() + getPaddingTop() + getPaddingBottom());
setMeasuredDimension(getMeasuredWidth(), height);
}
}
Использование
<com.mypackage.DrawableAlignedButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:drawableLeft="@drawable/my_drawable"
android:gravity="center"
android:padding="7dp"
android:text="My Text" />
Ответ 7
Все предыдущие ответы кажутся устаревшими
Теперь вы можете использовать MaterialButton
, который позволяет установить гравитацию значка.
<com.google.android.material.button.MaterialButton
android:id="@+id/btnDownloadPdf"
android:layout_width="0dp"
android:layout_height="56dp"
android:layout_margin="16dp"
android:gravity="center"
android:textAllCaps="true"
app:backgroundTint="#fc0"
app:icon="@drawable/ic_pdf"
app:iconGravity="textStart"
app:iconPadding="10dp"
app:iconTint="#f00"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:text="Download Pdf" />
![enter image description here]()
Изменить:
Для использования компонентов материала вам, очевидно, потребуется:
Добавить зависимость
implementation 'com.google.android.material:material:1.1.0-alpha10'
(последняя версия)
Заставьте свою тему расширить тему Материальных компонентов
<style name="AppTheme" parent="Theme.MaterialComponents.Light">
...
</style>
Если вы не можете этого сделать, расширьте его из темы Material Bridge
<style name="AppTheme" parent="Theme.MaterialComponents.Light.Bridge">
...
</style>
Ответ 8
Я знаю, что этот вопрос немного старше, но, возможно, вы все еще открыты для подсказок или обходных решений:
Создайте RelativeLayout "wrap_content" с изображением кнопки в качестве фона или самой кнопки в качестве первого элемента макета. Получите LinearLayout и установите его в "layout_centerInParent" и "wrap_content". Затем установите Drawable как изображение. Наконец, установите TextView с текстом (locale).
так что в основном у вас есть эта структура:
RelativeLayout
Button
LinearLayout
ImageView
TextView
или вот так:
RelativeLayout with "android-specific" button image as background
LinearLayout
ImageView
TextView
Я знаю, что с этим решением есть много элементов, с которыми можно справиться, но вы можете легко создать свою собственную пользовательскую кнопку, а также установить точное положение текста и чертежей:)
Ответ 9
Это мое решение я написал 3 года назад. Кнопка имеет текст и левую иконку и находится во фрейме, который является настоящей кнопкой здесь и может быть растянут заполнением fill_parent. Я не могу проверить это снова, но это работало тогда. Вероятно, кнопку не нужно использовать, и ее можно заменить на TextView, но я не буду тестировать ее прямо сейчас, и здесь она не слишком сильно меняет функциональность.
<FrameLayout
android:id="@+id/login_button_login"
android:background="@drawable/apptheme_btn_default_holo_dark"
android:layout_width="fill_parent"
android:layout_gravity="center"
android:layout_height="40dp">
<Button
android:clickable="false"
android:drawablePadding="15dp"
android:layout_gravity="center"
style="@style/WhiteText.Small.Bold"
android:drawableLeft="@drawable/lock"
android:background="@color/transparent"
android:text="LOGIN" />
</FrameLayout>
Ответ 10
Мой способ решения проблемы связан с кнопкой с легкими <View ../>
элементами, которые изменяются динамически. Ниже приведены несколько примеров того, что может быть достигнуто с помощью этого:
![Demo by Dev-iL]()
Обратите внимание, что интерактивная область кнопок в примере 3 такая же, как у 2 (т.е. с пробелами), которая отличается от примера 4, где между пробелами нет "незаметных" промежутков.
код:
<?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="vertical">
<TextView
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textStyle="bold"
android:text="Example 1: Button with a background color:"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:textColor="@android:color/white"
android:drawableLeft="@android:drawable/ic_secure"
android:drawableStart="@android:drawable/ic_secure"
android:background="@android:color/darker_gray"
android:paddingStart="20dp"
android:paddingEnd="20dp"
android:layout_weight="0.3"/>
<!-- Play around with the above 3 values to modify the clickable
area and image alignment with respect to text -->
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
</LinearLayout>
<TextView
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textStyle="bold"
android:text="Example 2: Button group + transparent layout + spacers:"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:textColor="@android:color/white"
android:drawableLeft="@android:drawable/ic_secure"
android:drawableStart="@android:drawable/ic_secure"
android:background="@android:color/darker_gray"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:layout_weight="1"/>
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:textColor="@android:color/white"
android:drawableLeft="@android:drawable/ic_secure"
android:drawableStart="@android:drawable/ic_secure"
android:background="@android:color/darker_gray"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:layout_weight="1"/>
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:textColor="@android:color/white"
android:drawableLeft="@android:drawable/ic_secure"
android:drawableStart="@android:drawable/ic_secure"
android:background="@android:color/darker_gray"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:layout_weight="1"/>
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
</LinearLayout>
<TextView
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textStyle="bold"
android:text="Example 3: Button group + colored layout:"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/darker_gray">
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
<Button
style="?android:attr/buttonBarButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:textColor="@android:color/white"
android:drawableLeft="@android:drawable/ic_secure"
android:drawableStart="@android:drawable/ic_secure"
android:background="@android:color/darker_gray"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:layout_weight="1"/>
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
<Button
style="?android:attr/buttonBarButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:textColor="@android:color/white"
android:drawableLeft="@android:drawable/ic_secure"
android:drawableStart="@android:drawable/ic_secure"
android:background="@android:color/darker_gray"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:layout_weight="1"/>
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
<Button
style="?android:attr/buttonBarButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:textColor="@android:color/white"
android:drawableLeft="@android:drawable/ic_secure"
android:drawableStart="@android:drawable/ic_secure"
android:background="@android:color/darker_gray"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:layout_weight="1"/>
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
</LinearLayout>
<TextView
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textStyle="bold"
android:text="Example 4 (reference): Button group + no spacers:"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/darker_gray">
<Button
style="?android:attr/buttonBarButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:textColor="@android:color/white"
android:drawableLeft="@android:drawable/ic_secure"
android:drawableStart="@android:drawable/ic_secure"
android:background="@android:color/darker_gray"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:layout_weight="1"/>
<Button
style="?android:attr/buttonBarButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:textColor="@android:color/white"
android:drawableLeft="@android:drawable/ic_secure"
android:drawableStart="@android:drawable/ic_secure"
android:background="@android:color/darker_gray"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:layout_weight="1"/>
<Button
style="?android:attr/buttonBarButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:textColor="@android:color/white"
android:drawableLeft="@android:drawable/ic_secure"
android:drawableStart="@android:drawable/ic_secure"
android:background="@android:color/darker_gray"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:layout_weight="1"/>
</LinearLayout>
</LinearLayout>
Ответ 11
Вы можете создать собственный виджет:
Класс Java IButton:
public class IButton extends RelativeLayout {
private RelativeLayout layout;
private ImageView image;
private TextView text;
public IButton(Context context) {
this(context, null);
}
public IButton(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public IButton(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
LayoutInflater inflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = inflater.inflate(R.layout.ibutton, this, true);
layout = (RelativeLayout) view.findViewById(R.id.btn_layout);
image = (ImageView) view.findViewById(R.id.btn_icon);
text = (TextView) view.findViewById(R.id.btn_text);
if (attrs != null) {
TypedArray attributes = context.obtainStyledAttributes(attrs,R.styleable.IButtonStyle);
Drawable drawable = attributes.getDrawable(R.styleable.IButtonStyle_button_icon);
if(drawable != null) {
image.setImageDrawable(drawable);
}
String str = attributes.getString(R.styleable.IButtonStyle_button_text);
text.setText(str);
attributes.recycle();
}
}
@Override
public void setOnClickListener(final OnClickListener l) {
super.setOnClickListener(l);
layout.setOnClickListener(l);
}
public void setDrawable(int resId) {
image.setImageResource(resId);
}
}
Макет ibutton.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/btn_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true" >
<ImageView
android:id="@+id/btn_icon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginRight="2dp"
android:layout_toLeftOf="@+id/btn_text"
android:duplicateParentState="true" />
<TextView
android:id="@+id/btn_text"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_centerInParent="true"
android:duplicateParentState="true"
android:gravity="center_vertical"
android:textColor="#000000" />
</RelativeLayout>
Чтобы использовать этот настраиваемый виджет:
<com.test.android.widgets.IButton
android:id="@+id/new"
android:layout_width="fill_parent"
android:layout_height="@dimen/button_height"
ibutton:button_text="@string/btn_new"
ibutton:button_icon="@drawable/ic_action_new" />
Вы должны указать пространство имен для пользовательских атрибутов
XMLNS: IButton = "http://schemas.android.com/apk/res/com.test.android.xxx"
где com.test.android.xxx является корневым пакетом приложения.
Просто поставьте его ниже xmlns: android = "http://schemas.android.com/apk/res/android".
Последнее, что вам понадобится, это пользовательские атрибуты в attrs.xml.
В файле attrs.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="IButtonStyle">
<attr name="button_text" />
<attr name="button_icon" format="integer" />
</declare-styleable>
<attr name="button_text" />
</resources>
Для лучшего позиционирования оберните пользовательскую кнопку внутри LinearLayout, если вы хотите избежать потенциальных проблем с позициями RelativeLayout.
Наслаждайтесь!
Ответ 12
Имел подобную проблему, но хотел иметь доступ к центру без текста и без завернутых макетов. Решение заключалось в создании пользовательской кнопки и добавлении еще одного в дополнение к LEFT, RIGHT, TOP, BOTTOM. Можно легко изменить место размещения и разместить его в нужном месте относительно текста.
CenterDrawableButton.java
public class CenterDrawableButton extends Button {
private Drawable mDrawableCenter;
public CenterDrawableButton(Context context) {
super(context);
init(context, null);
}
public CenterDrawableButton(Context context, AttributeSet attrs) {
super(context, attrs);
init(context, attrs);
}
public CenterDrawableButton(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context, attrs);
}
@TargetApi(Build.VERSION_CODES.LOLLIPOP)
public CenterDrawableButton(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
init(context, attrs);
}
private void init(Context context, AttributeSet attrs){
//if (isInEditMode()) return;
if(attrs!=null){
TypedArray a = context.getTheme().obtainStyledAttributes(
attrs, R.styleable.CenterDrawableButton, 0, 0);
try {
setCenterDrawable(a.getDrawable(R.styleable.CenterDrawableButton_drawableCenter));
} finally {
a.recycle();
}
}
}
public void setCenterDrawable(int center) {
if(center==0){
setCenterDrawable(null);
}else
setCenterDrawable(getContext().getResources().getDrawable(center));
}
public void setCenterDrawable(@Nullable Drawable center) {
int[] state;
state = getDrawableState();
if (center != null) {
center.setState(state);
center.setBounds(0, 0, center.getIntrinsicWidth(), center.getIntrinsicHeight());
center.setCallback(this);
}
mDrawableCenter = center;
invalidate();
requestLayout();
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
if(mDrawableCenter!=null) {
setMeasuredDimension(Math.max(getMeasuredWidth(), mDrawableCenter.getIntrinsicWidth()),
Math.max(getMeasuredHeight(), mDrawableCenter.getIntrinsicHeight()));
}
}
@Override
protected void drawableStateChanged() {
super.drawableStateChanged();
if (mDrawableCenter != null) {
int[] state = getDrawableState();
mDrawableCenter.setState(state);
mDrawableCenter.setBounds(0, 0, mDrawableCenter.getIntrinsicWidth(),
mDrawableCenter.getIntrinsicHeight());
}
invalidate();
}
@Override
protected void onDraw(@NonNull Canvas canvas) {
super.onDraw(canvas);
if (mDrawableCenter != null) {
Rect rect = mDrawableCenter.getBounds();
canvas.save();
canvas.translate(getWidth() / 2 - rect.right / 2, getHeight() / 2 - rect.bottom / 2);
mDrawableCenter.draw(canvas);
canvas.restore();
}
}
}
attrs.xml
<resources>
<attr name="drawableCenter" format="reference"/>
<declare-styleable name="CenterDrawableButton">
<attr name="drawableCenter"/>
</declare-styleable>
</resources>
Использование
<com.virtoos.android.view.custom.CenterDrawableButton
android:id="@id/centerDrawableButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:drawableCenter="@android:drawable/ic_menu_info_details"/>
Ответ 13
Попробуйте использовать эту библиотеку
OmegaCenterIconButton
![enter image description here]()
Ответ 14
<style name="captionOnly">
<item name="android:background">@null</item>
<item name="android:clickable">false</item>
<item name="android:focusable">false</item>
<item name="android:minHeight">0dp</item>
<item name="android:minWidth">0dp</item>
</style>
<FrameLayout
style="?android:attr/buttonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
style="@style/captionOnly"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:drawableLeft="@android:drawable/ic_delete"
android:gravity="center"
android:text="Button Challenge" />
</FrameLayout>
Поместите FrameLayout в LinearLayout и установите ориентацию на горизонтальную.
Ответ 15
Вы можете поместить кнопку над LinearLayout
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="@dimen/activity_login_fb_height"
android:background="@mipmap/bg_btn_fb">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/lblLoginFb"
android:textColor="@color/white"
android:drawableLeft="@mipmap/icon_fb"
android:textSize="@dimen/activity_login_fb_textSize"
android:text="Login with Facebook"
android:gravity="center" />
</LinearLayout>
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/btnLoginFb"
android:background="@color/transparent"
/>
</RelativeLayout>
Ответ 16
Я установил textView
с помощью значка с помощью paddingLeft
и выравнивания textView до left | centerVertical. и для небольшого промежутка между представлением и значком я я использовал drawablePadding
<Button
android:id="@+id/have_it_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/textbox"
android:drawableLeft="@drawable/have_it"
android:drawablePadding="30dp"
android:gravity="left|center_vertical"
android:paddingLeft="60dp"
android:text="Owner Contact"
android:textColor="@android:color/white" />
Ответ 17
Что произойдет, если вы попробуете андроид: gravity = "center_horizontal"?
Ответ 18
Я думаю, что андроид: gravity = "center" должен работать
Ответ 19
Как было предложено Rodja, до 4.0 нет прямого способа центрировать текст с помощью drawable. И действительно, установка значения padding_left перемещает выделение с границы. Поэтому мое предложение состоит в том, что во время выполнения вы точно вычисляете, сколько пикселов с левой границы нужно выполнить, и затем передайте их с помощью setPadding
Ваш расчет может быть чем-то вроде
int paddingLeft = (button.getWidth() - drawableWidth - textWidth) / 2;
Ширина вашего drawable исправлена, и вы можете просмотреть ее, и вы также можете рассчитать или угадать ширину текста.
Наконец, вам нужно будет умножить значение заполнения на плотность экрана, что вы можете сделать, используя DisplayMetrics
Ответ 20
Я не тестирую его, но, похоже, вы можете использовать CenteredContentButton library
Ответ 21
Открытый класс DrawableCenterTextView расширяет TextView {
public DrawableCenterTextView(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
}
public DrawableCenterTextView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public DrawableCenterTextView(Context context) {
super(context);
}
@Override
protected void onDraw(Canvas canvas) {
Drawable[] drawables = getCompoundDrawables();
if (drawables != null) {
Drawable drawableLeft = drawables[0];
Drawable drawableRight = drawables[2];
if (drawableLeft != null || drawableRight != null) {
float textWidth = getPaint().measureText(getText().toString());
int drawablePadding = getCompoundDrawablePadding();
int drawableWidth = 0;
if (drawableLeft != null)
drawableWidth = drawableLeft.getIntrinsicWidth();
else if (drawableRight != null) {
drawableWidth = drawableRight.getIntrinsicWidth();
}
float bodyWidth = textWidth + drawableWidth + drawablePadding;
canvas.translate((getWidth() - bodyWidth) / 2, 0);
}
}
super.onDraw(canvas);
}
}
Ответ 22
Грязное исправление.
android:paddingTop="10dp"
android:drawableTop="@drawable/ic_src"
Определение правильного заполнения позволяет решить эту задачу. Однако для различного экрана используйте разные дополнения и помещайте это в размерный ресурс в соответствующей папке значений.
Ответ 23
Используйте RelativeLayout (контейнер) и android: layout_centerHorizontal = "true"
, мой пример:
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" >
<CheckBox
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_gravity="center"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:button="@drawable/bg_fav_detail"
android:drawablePadding="5dp"
android:text=" Favorite" />
</RelativeLayout>
Ответ 24
Другая возможность сохранить тему Button.
<Button
android:id="@+id/pf_bt_edit"
android:layout_height="@dimen/standard_height"
android:layout_width="match_parent"
/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_alignBottom="@id/pf_bt_edit"
android:layout_alignLeft="@id/pf_bt_edit"
android:layout_alignRight="@id/pf_bt_edit"
android:layout_alignTop="@id/pf_bt_edit"
android:layout_margin="@dimen/margin_10"
android:clickable="false"
android:elevation="20dp"
android:gravity="center"
android:orientation="horizontal"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:clickable="false"
android:src="@drawable/ic_edit_white_48dp"/>
<TextView
android:id="@+id/pf_tv_edit"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/margin_5"
android:clickable="false"
android:gravity="center"
android:text="@string/pf_bt_edit"/>
</LinearLayout>
С помощью этого решения, если ваш add
@Цвет/your_color
@Цвет/your_highlight_color
в теме своей деятельности вы можете иметь тему Matherial на Lollipop с тенью и рябью, а для предыдущей версии плоская кнопка с вашим цветом и выделить coor при нажатии на нее.
Кроме того, при этом решении авторезистируют изображение
Результат:
Сначала на устройстве Lollipop
Второе: на переднем ледяном устройстве
3-й: кнопка прессового устройства с ледяным устройством
![введите описание изображения здесь]()
Ответ 25
Это может быть старая/закрытая тема, но я везде искал что-то полезное, пока не решил создать собственное решение. Если любой, кто пытается найти ответ, попробуй это, может сэкономить минуту размышлений.
<LinearLayout
android:id="@+id/llContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/selector"
android:clickable="true"
android:gravity="center"
android:orientation="vertical"
android:padding="10dp"
android:textStyle="bold">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="This is a text" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/icon_image />
</LinearLayout>
Поскольку линейный макет действует как контейнер и тот, у кого есть селектор, когда вы нажимаете на весь линейный макет, он будет выглядеть так, как это должно быть. если вы хотите, чтобы он был центрирован, используйте относительную интуицию. Если вы хотите, чтобы он был центрирован по горизонтали, измените ориентацию на горизонтальную.
Обратите внимание, что НЕ НЕ забыть добавить андроид: clickable = "true" в свой основной контейнер (относительный или линейный) для действия.
Снова это может быть старый поток, но все равно может помочь кому-то там.
-человеки надеются, что это поможет -
happycodings.
Ответ 26
Если вы используете одно из решений пользовательского представления, будьте осторожны, потому что они часто терпят неудачу на длинном или многострочном тексте. Я переписал некоторые ответы, заменил onDraw()
и понял, что это неверный путь.
Ответ 27
используйте это
android:background="@drawable/ic_play_arrow_black_24dp"
просто установите фон значку, который хотите центрировать.