Make raster clipping of tiles in x, but stretch in y

Question

I have an image that I use as background for RelativeLayout. The image must be laid out horizontally to create a pattern.

I can make the image tiled horizontally using this code:

BitmapDrawable b3 = (BitmapDrawable)getResources().getDrawable(R.drawable.background); b3.setTileModeX(Shader.TileMode.REPEAT); v.findViewById(R.id.layout).setBackgroundDrawable(b3); 

The problem is that the image is also split vertically. It seems that it is in the "clamp" mode in the vertical, but "repeated" mode in the horizontal plane. Here is a screenshot:

As you can see, the image is slightly smaller than the space it occupies, and the bottom edge is “clamped”.

How to adjust image stretching vertically, but horizontally?

Answer 1

This method causes a new bitmap to be created, but it looks like it accentuates your target

  View view = findViewById(R.id.layout); BitmapDrawable bd = (BitmapDrawable) getResources().getDrawable(R.drawable.tile); int width = view.getWidth(); int intrinsicHeight = bd.getIntrinsicHeight(); Rect bounds = new Rect(0,0,width,intrinsicHeight); bd.setTileModeX(TileMode.REPEAT); bd.setBounds(bounds); Bitmap bitmap = Bitmap.createBitmap(bounds.width(), bounds.height(), bd.getBitmap().getConfig()); Canvas canvas = new Canvas(bitmap); bd.draw(canvas); BitmapDrawable bitmapDrawable = new BitmapDrawable(getResources(), bitmap); view.setBackground(bitmapDrawable); 

Note that it only works if the view has already been styled, so the lile onWindowFocusChanged method is a good place for this code.

Answer 2

I feel this straight: (This code will alternate in Y and repeat in x)

In your onWindowFoucsChanged you call:

  public void onWindowFocusChanged(boolean hasFocus) { // TODO Auto-generated method stub super.onWindowFocusChanged(hasFocus); Drawable d = getRepeatingBG(this, R.drawable.image_that_you_want_to_repeat); body_view.setBackgroundDrawable(d); } private Drawable getRepeatingBG(Activity activity, int center) { DisplayMetrics dm = new DisplayMetrics(); activity.getWindowManager().getDefaultDisplay().getMetrics(dm); BitmapFactory.Options options = new BitmapFactory.Options(); options.inScaled=true; Bitmap center_bmp = BitmapFactory.decodeResource(activity.getResources(), center, options); center_bmp.setDensity(Bitmap.DENSITY_NONE); center_bmp=Bitmap.createScaledBitmap(center_bmp, dm.widthPixels , center_bmp.getHeight(), true); BitmapDrawable center_drawable = new BitmapDrawable(activity.getResources(),center_bmp); //change here setTileModeY to setTileModeX if you want to repear in X center_drawable.setTileModeY(Shader.TileMode.REPEAT); return center_drawable; } 

Answer 3

Too late for you, but may be helpful to others.

To do this, you can create a custom view. Just scale the original bitmap so that it is as tall as your image and then draw it several times on the canvas:

 public class RepeatingXImageView extends View { Bitmap bitmap; Paint paint; public RepeatingXImageView(Context context) { super(context); } public RepeatingXImageView(Context context, AttributeSet attrs) { super(context, attrs); } public RepeatingXImageView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); } @Override protected void onLayout(boolean changed, int left, int top, int right, int bottom) { super.onLayout(changed, left, top, right, bottom); if(changed) { paint = new Paint(); bitmap = BitmapFactory.decodeResource(getContext().getResources(), R.drawable.seekbar_overlay); bitmap = Bitmap.createScaledBitmap(bitmap, bitmap.getWidth(), bottom - top, false); } } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); if(bitmap == null) return; int left = 0; while(left < getWidth()) { canvas.drawBitmap(bitmap, left, 0, paint); left += bitmap.getWidth(); } } } 

Answer 4

The same problem. I tried using a 9patch image, but it seems that you cannot use 9patch images with tiling, 9patch stretches the image no matter what you define in the tiling property. In the end, what I will do is ask the creator of the image to stretch it vertically or do it yourself. I would love a better solution if anyone finds one.