当前位置: 首页 > 知识库问答 >
问题:

Android小计数器旁边的一个按钮

章昱
2023-03-14

我想在按钮旁边添加一个小计数器,以显示某些物品的剩余数量,例如,剩余未使用的小费数量。目标布局如下所示:

我研究过网络,发现有些人说每种数量使用不同的图片。然而,如果数量可以达到100,怎么解决呢?真的有必要这样画出来吗?

我正在考虑将两个按钮粘在一个RelativeLayout中,这样当用户按下底部按钮时,顶部按钮将向上和向下计数,并setText本身,但是否有更好的解决方案或导入?

感谢鲁佩什的代码和建议!我已经实现了如下。然而,你知道如何将红色圆圈文本视图进一步向右移动吗?而20也不能正确地显示在红色圆圈中。。。

<FrameLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="10dp"
    android:layout_marginTop="10dp" >

    <Button
        android:id="@+id/button_tip"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_marginBottom="1dp"
        android:layout_marginLeft="2dp"
        android:layout_marginRight="2dp"
        android:layout_marginTop="5dp"
        android:background="@drawable/orange_btn"
        android:onClick="button_tip_click"
        android:text="Hello" />

    <TextView
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:layout_gravity="top|right"
        android:background="@drawable/red_circle_btn"
        android:gravity="center"
        android:text="20"
        android:textColor="@color/white"
        android:textSize="8sp"
        android:textStyle="bold" />
</FrameLayout>

共有3个答案

公孙辰龙
2023-03-14

我建议你可以使用框架布局。1.-你可以使用两个图像,一个用于按钮,一个用于小圆圈,一个用于数字的文本视图。。。2.-你可以用一张图片来制作你的按钮,为小圆和文本视图创建一个渐变。。

对于frameLayout,请参阅:http://developer.android.com/reference/android/widget/FrameLayout.html对于渐变,请参阅:如何在Android中制作渐变背景。

曹普松
2023-03-14

使用这个-并继续用计数更新文本视图文本

 <FrameLayout
     android:layout_width="wrap_content"
     android:layout_height="wrap_content">

 <ImageView
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:src="@drawable/your_phone_call_image"
     android:gravity="center"
     android:scaletype="matrix"/>

  <TextView
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="1"
     android:padding="5dp"
     android:gravity="top|right"  <!--this is important-->
     android:background="@drawable/your_counter_red_background"/>
 </FrameLayout>
司马德水
2023-03-14

将Button的背景Drawable设置为自定义Drawable,例如:

public class DecoratedTextViewDrawable extends LayerDrawable {
    private int mCnt = 0;
    private Paint mPaint;
    private TextView mParent;
    private ColorStateList mColors;
    private Rect mBounds;

    public DecoratedTextViewDrawable(TextView tv, Drawable[] layers, int cnt) {
        super(layers);
        mParent = tv;
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPaint.setTextAlign(Align.CENTER);
        mPaint.setTextSize(tv.getTextSize());
        mPaint.setTypeface(Typeface.DEFAULT_BOLD);
        int[][] states = {
                {android.R.attr.state_pressed}, {android.R.attr.state_focused}, {}
        };
        int[] colors = {
                0xff0000aa, 0xff880000, 0xff00aa00
        };
        mColors = new ColorStateList(states, colors);
        mBounds = new Rect();
        setCnt(cnt);
    }

    public void setCnt(int cnt) {
        mCnt = cnt;
        String s = Integer.toString(cnt);
        mPaint.getTextBounds(s, 0, s.length(), mBounds);
        invalidateSelf();
    }

    @Override
    protected boolean onStateChange(int[] state) {
        invalidateSelf();
        return super.onStateChange(state);
    }

    @Override
    public boolean isStateful() {
        return true;
    }

    @Override
    public void draw(Canvas canvas) {
        super.draw(canvas);

        float x = mPaint.getTextSize() * 1.5f;
        float r = mPaint.getTextSize() * 0.9f;
        int base = mParent.getBaseline();
        int[] stateSet = getState();
//        Log.d(TAG, "draw " + StateSet.dump(stateSet));
        int color = mColors.getColorForState(stateSet, 0xff000000);
        mPaint.setColor(color);
        canvas.drawCircle(x, base + mBounds.top + mBounds.height() / 2, r, mPaint);
        mPaint.setColor(0xffeeeeee);
        canvas.drawText(Integer.toString(mCnt), x, base, mPaint);
    }
}

你可以这样使用它:

// Activity.onCreate method
LinearLayout ll = new LinearLayout(this);
ll.setOrientation(LinearLayout.VERTICAL);

int NUM = 5;
final int[] cnt = new int[NUM];
Random r = new Random();
for (int i = 0; i < NUM; i++) {
    cnt[i] = r.nextInt(20);
    Button b = new Button(this);
    b.setText("Click me");
    b.setTextSize(18);
    b.setTag(i);

    Drawable[] layers = {b.getBackground()};
    Drawable d = new DecoratedTextViewDrawable(b, layers, cnt[i]);
    b.setBackgroundDrawable(d);
    OnClickListener l = new OnClickListener() {
        @Override
        public void onClick(View v) {
            DecoratedTextViewDrawable  d = (DecoratedTextViewDrawable) v.getBackground();
            int idx = (Integer) v.getTag();
            d.setCnt(++cnt[idx]);
        }
    };
    b.setOnClickListener(l);
    ll.addView(b);
}
setContentView(ll);
 类似资料:
  • 我正在使用android studio开发一个应用程序,我想在按钮中的文本中添加一个图标,如下所示: 这是我的xml代码: 谢谢你帮助我;

  • 我有一个文本框和一个下拉菜单。根据下拉菜单中选择的值,如果需要,我将textbox更改为datepicker字段。功能工作良好,但我看到在激活datepicker时,textbox和dropdown之间有一个小按钮。当datepicker被销毁时,它就会消失。 有什么想法,我可以摆脱这个按钮,只是触发datepicker日历时,用户点击文本框?

  • 我使用GridPane作为舞台的主要场景,布局完全是在FXML文件中定义的。我想有一个按钮在窗口的整个边(即在我的GridPane的所有行上),如下所示: 然而,我就是不能让它工作。更确切地说,它似乎只是按钮不会增加整个高度。我已经为按钮设置了、和,但按钮仍然与其中的文本一样长,并且放在侧面的中心。 我如何使按钮延伸到整个网格窗格?正如开头提到的,我当然已经正确设置了。这并不是按钮没有正确地放置在

  • 我已经画了一个正方形,但是我怎样才能在它旁边放置另一个正方形而没有任何空隙呢?我认为< code>mRedRect1F中的第一个参数(0)需要更改,但我不知道该更改什么。 使现代化

  • 我需要帮助。我想做一个按钮,对一个数字进行四舍五入,十进制乘以十进制,比如 1.2345 到 1.234 到 1.23 等。我不想使用 Math.round,因为它四舍五入到一个整数,而且我不知道我是否可以使用 *10/10、*100/100 等,因为我的答案中得到了不同的小数点。在我点击 并完成答案后,此按钮必须在计算器上工作。 我还需要帮助来使用到“List”组件中的标签。

  • 我需要生成一个报告,其中页面的左半部分包含标题数据(两次),页面的右半部分包含详细记录。 我了解到,这些带总是跨越页面的整个宽度,所以很明显,我无法将标题带的大小调整到页面宽度的一半。 将报告设置为2列似乎没有帮助,因为它只允许我将详细记录拆分为列。 我还需要标题显示两次,但这可能是另一个问题的主题。 第一次使用JasperSoft Studio完成JasperReport newbie。