如何在android中调整购物车的位置编号文本

时间:2016-05-24 12:51:59

标签: android android-studio

我在Android中使用数字文本制作购物车。但是默认情况下红色圆圈的位置在数字位于中心位置,

我希望这些图像处于最佳位置。请给我建议我想要改变的地方。

ic_menu_cart.xml

 <?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
 <item android:id="@+id/ic_cart" 
  android:drawable="@drawable/ic_cart" 
  android:gravity="center" /> 
 //Layer2: Actual badge count to display
 <!-- set a place holder Drawable so android:drawable isn't null --> 
 <item android:id="@+id/ic_badge" 
  android:drawable="@drawable/ic_cart" /> 
 </layer-list>

main.xml中

 <menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="com.example.mobikul.MainActivity" >
<item
    android:id="@+id/action_bell"
    android:icon="@drawable/ic_menu_notifications"
    app:showAsAction="always"
    android:title="@string/action_bell"/>
<item
    android:id="@+id/action_cart"
    android:icon="@drawable/ic_menu_cart"
    app:showAsAction="always"
    android:title="@string/action_cart"/>   
</menu>

创建灵活高效的自定义BagdeDrawable类来绘制看起来像计数的视图  的 BagdeDrawable.java

 public class BadgeDrawable extends Drawable {

  private float mTextSize;
  private Paint mBadgePaint;
  private Paint mBadgePaint1;
  private Paint mTextPaint;
  private Rect mTxtRect = new Rect();

  private String mCount = "";
  private boolean mWillDraw = false;

  public BadgeDrawable(Context context) {

   mTextSize = context.getResources().getDimension(R.dimen.badge_text_size);
  mBadgePaint = new Paint();
  mBadgePaint.setColor(Color.RED);
  mBadgePaint.setAntiAlias(true);
  mBadgePaint.setStyle(Paint.Style.FILL);
  mBadgePaint1 = new Paint();
  mBadgePaint1.setColor(Color.parseColor("#EEEEEE"));
  mBadgePaint1.setAntiAlias(true);
  mBadgePaint1.setStyle(Paint.Style.FILL);

  mTextPaint = new Paint();
  mTextPaint.setColor(Color.WHITE);
  mTextPaint.setTypeface(Typeface.DEFAULT);
  mTextPaint.setTextSize(mTextSize);
  mTextPaint.setAntiAlias(true);
  mTextPaint.setTextAlign(Paint.Align.CENTER);
  }

   @Override
  public void draw(Canvas canvas) {
  if (!mWillDraw) {
     return;
  }
  Rect bounds = getBounds();
  float width = bounds.right - bounds.left;
  float height = bounds.bottom - bounds.top;
  // Position the badge in the top-right quadrant of the icon.

  /*Using Math.max rather than Math.min */
  float radius = ((Math.max(width, height) / 2)) / 2;
  float centerX = (width - radius - 1) +10;
  float centerY = radius -5;
  if(mCount.length() &lt;= 2){
     // Draw badge circle.
     canvas.drawCircle(centerX, centerY, radius+9, mBadgePaint1);
     canvas.drawCircle(centerX, centerY, radius+7, mBadgePaint);
  }
  else{
     canvas.drawCircle(centerX, centerY, radius+10, mBadgePaint1);
     canvas.drawCircle(centerX, centerY, radius+8, mBadgePaint);
  }
  // Draw badge count text inside the circle.
  mTextPaint.getTextBounds(mCount, 0, mCount.length(), mTxtRect);
  float textHeight = mTxtRect.bottom - mTxtRect.top;
  float textY = centerY + (textHeight / 2f);
  if(mCount.length() &gt; 2)
     canvas.drawText("99+", centerX, textY, mTextPaint);
  else
     canvas.drawText(mCount, centerX, textY, mTextPaint);
  }

  /*
  Sets the count (i.e notifications) to display.
 */
  public void setCount(String count) {
  mCount = count;
  // Only draw a badge if there are notifications.
  mWillDraw = !count.equalsIgnoreCase("0");
  invalidateSelf();
 }

 @Override
 public void setAlpha(int alpha) {
  // do nothing
 }

 @Override
 public void setColorFilter(ColorFilter cf) {
  // do nothing
 }

 @Override
 public int getOpacity() {
  return PixelFormat.UNKNOWN;
 }
}

使用getIcon()方法获取菜单图标。         IN onCreateOptionsMenu:

   MenuItem itemCart = menu.findItem(R.id.action_cart);
   LayerDrawable icon = (LayerDrawable) itemCart.getIcon();
   // Update LayerDrawable's BadgeDrawable
   setBadgeCount(this, icon,"9");

这是我们的方法setBadgeCount()。我们可以从应用程序的任何地方传递我们从meniItem和setBadge获取的LayerDrawable。

  public static void setBadgeCount(Context context, LayerDrawable icon, String count) {
  BadgeDrawable badge; // Reuse drawable if possible
  Drawable reuse = icon.findDrawableByLayerId(R.id.ic_badge); //getting the    layer 2
  if (reuse != null && reuse instanceof BadgeDrawable) {
  badge = (BadgeDrawable) reuse;
  }
  else {
  badge = new BadgeDrawable(context);
  }
  badge.setCount(count);
  icon.mutate();
  icon.setDrawableByLayerId(R.id.ic_badge, badge);
  }       

1 个答案:

答案 0 :(得分:0)

我刚刚在draw()方法中更改了这些代码:

 float radius= Math.min(width, height)/8.0f;
    float centerX =width-radius+6.2f;
    float centerY = radius-10.0f;