I'd like to programmatically create a button with a custom drawn shape as the image. In my activity's onCreate, I have:
final FrameLayout contentContainer = new FrameLayout(this);
final FrameLayout.LayoutParams contentLayoutParams = new FrameLayout.LayoutParams(
FrameLayout.LayoutParams.FILL_PARENT,
FrameLayout.LayoutParams.FILL_PARENT);
contentContainer.setLayoutParams(contentLayoutParams);
contentContainer.setBackgroundColor(Color.BLUE);
int size = 50;
final ShapeDrawable drawable = new ShapeDrawable(new OvalShape());
drawable.getPaint().setColor(Color.RED);
drawable.setBounds(0, 0, size, size);
final ImageButton leftArrow = new ImageButton(this);
leftArrow.setImageDrawable(drawable);
final FrameLayout.LayoutParams lp = new FrameLayout.LayoutParams(size, size);
leftArrow.setLayoutParams(lp);
contentContainer.addView(leftArrow);
When I run the app, I see a blue screen with a plain white button. I has hoping to see a red oval on the button, but it seems I'm not understanding the setImageDrawable call.
Any suggestions how to achieve this? Thanks!
Related
I am using the google vision API and it can return the color scheme of a picture like this:
The API itself returns values to calculate the exact color from the RGB values and to calculate how much of the image contains that color in %.
I am trying to create something like in the first picture. But I have no clue how to do that, so far I just have a listview that gives an overview shown like here.
Does anyone have an idea how I can create a horizontal color scheme in android where I specify all the colors myself? Even a horizontal listview might work with dynamic widths for each color to reflect the percentage.
Thank you!
You can use LinearLayout and dinamically add child views to it with the weight equal to the percentage of the color :
// sample colors
final int color1 = Color.parseColor("#8da921");
final int color2 = Color.parseColor("#1f0929");
final int color3 = Color.parseColor("#f0b991");
// sample color percentages
final int colorPercentage1 = 60;
final int colorPercentage2= 10;
final int colorPercentage3 = 30;
// you should have this layout defined in your xml
final LinearLayout linearLayout = (LinearLayout) findViewById(R.id.linearLayout);
linearLayout.setWeightSum(100);
// create the views
final View view1 = new View(this);
final LinearLayout.LayoutParams viewParams1 = new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.MATCH_PARENT);
viewParams1.weight = colorPercentage1;
view1.setLayoutParams(viewParams1);
view1.setBackgroundColor(color1);
final View view2 = new View(this);
final LinearLayout.LayoutParams viewParams2 = new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.MATCH_PARENT);
viewParams2.weight = colorPercentage2;
view2.setLayoutParams(viewParams2);
view2.setBackgroundColor(color2);
final View view3 = new View(this);
final LinearLayout.LayoutParams viewParams3 = new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.MATCH_PARENT);
viewParams3.weight = colorPercentage3;
view3.setLayoutParams(viewParams3);
view3.setBackgroundColor(color3);
//finally add the views
linearLayout.addView(view1);
linearLayout.addView(view2);
linearLayout.addView(view3);
How to make a horizontal color scheme in android
Simply inflate views with different weights inside of a LinearLayout with Horizontal orientation.
Here is the Android Studio code for my android app:
FrameLayout root = (FrameLayout) findViewById(R.id.root);
ImageView img = new ImageView(this);
img.setBackgroundColor(Color.RED);
//..load something inside the ImageView, we just set the background color
FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(20, 20);
params.leftMargin=Math.round(deltaX);
params.topMargin=Math.round(deltaY);
root.addView(img,params);
//...
I want to move this with animation when the value of topMargin and leftMargin change.
You can change to Padding
FrameLayout root = (FrameLayout) findViewById(R.id.root);
ImageView img = new ImageView(this);
FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(20, 20);
img.setLayoutParams(params);
img.setBackgroundColor(Color.RED);
//..load something inside the ImageView, we just set the background color
root.setPadding(deltaX, deltaX, 0, 0);
root.addView(img);
Then, you can use Property Animation
ObjectAnimator.ofFloat(root, "translationX", 0, 1000).start();
ObjectAnimator.ofFloat(root, "translationY", 0, 1000).start();
or
root.animate().translationY(100);
I have to create SeekBar with primary and secondary progress at runtime. Looking at tileify function for how should I treat LayerDrawable, and progress_horizontal_holo_dark.xml for proper IDs, i came up with following:
// parent view
LinearLayout parent = (LinearLayout) findViewById(R.id.parent);
// create widget
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
SeekBar seekBar = new SeekBar(this);
seekBar.setLayoutParams(params);
// set bg resources
Drawable background = getResources().getDrawable(R.drawable.scrubber_track_holo_light);
ScaleDrawable primary = new ScaleDrawable(getResources().getDrawable(R.drawable.scrubber_primary_holo), 0x10|0x03, 100.0f, 100);
ScaleDrawable secondary = new ScaleDrawable(getResources().getDrawable(R.drawable.scrubber_secondary_holo), 0x100x03, 100.0f, 85);
LayerDrawable layerDrawable = new LayerDrawable(new Drawable[] { background, secondary, primary});
layerDrawable.setId(0, android.R.id.background);
layerDrawable.setId(1, android.R.id.secondaryProgress);
layerDrawable.setId(2, android.R.id.progress);
seekBar.setBackgroundDrawable(layerDrawable);
seekBar.setThumb(getResources().getDrawable(R.drawable.seekbar_btn));
// set values
seekBar.setMax(50);
seekBar.setSecondaryProgress(25);
seekBar.setProgress(15);
parent.addView(seekBar);
This is how SeekBar should look like:
And this are mine resource files:
- scrubber_primary_holo.9.png
- scrubber_secondary_holo.9.png
Problem:
setProgressDrawable(layerDrawable) doesn't work as expected. I use this function in XML code, but if I use it at runtime, I get resultult as shown at the picture below.
Any ideas?
In case someone else has the same problem, I found the solution. There were two issues. First one is that ScaleBitmap although used in XML doesn't work from code. I had to use ClipDrawable. The second issue was with showing primary and secondary progress - they were shown after the first progress change. This is solved by adding seekBar to parent view first and then setting primary and secondary progress. You can see the source code below. Cheers!
// CREATE WIDGET
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
SeekBar seekBar = new SeekBar(this, null, android.R.attr.seekBarStyle);
seekBar.setLayoutParams(params);
parent.addView(seekBar);
seekBar.setMax(50);
seekBar.setProgress(15);
seekBar.setSecondaryProgress(25);
// CREATE PROGRESS BAR
LayerDrawable layerDrawable = (LayerDrawable) seekBar.getProgressDrawable();
seekBar.setThumb(getResources().getDrawable(R.drawable.seekbar_btn));
Drawable progress = (Drawable) layerDrawable.findDrawableByLayerId(android.R.id.progress);
Bitmap progressBmp = BitmapFactory.decodeResource(getResources(), R.drawable.scrubber_secondary_holo);
progress = new ClipDrawable(new BitmapDrawable(getResources(), progressBmp), Gravity.AXIS_PULL_BEFORE, ClipDrawable.HORIZONTAL);
layerDrawable.setDrawableByLayerId(android.R.id.progress, progress);
Drawable secondary = (Drawable) layerDrawable.findDrawableByLayerId(android.R.id.secondaryProgress);
Bitmap secondaryBmp = BitmapFactory.decodeResource(getResources(), R.drawable.scrubber_primary_holo);
secondary = new ClipDrawable(new BitmapDrawable(getResources(), secondaryBmp), Gravity.AXIS_PULL_BEFORE, ClipDrawable.HORIZONTAL);
layerDrawable.setDrawableByLayerId(android.R.id.secondaryProgress, secondary);
Drawable background = (Drawable) layerDrawable.findDrawableByLayerId(android.R.id.background);
Bitmap backgroundBmp = BitmapFactory.decodeResource(getResources(), R.drawable.scrubber_track_holo_light);
background = new BitmapDrawable(getResources(), backgroundBmp);
layerDrawable.setDrawableByLayerId(android.R.id.background, background);
I want to add one imageView, TextView in a Relative Layout with background image through programmatically.I spedified height and width for the relative layout but it is not fitting to the specified width and height. where am going wrong ploesae help
Thanks in advance
here is my Code:
RelativeLayout.LayoutParams lp_topheader = new RelativeLayout.LayoutParams(800,45);
relative_topheader = new RelativeLayout(this);
relative_topheader.setLayoutParams(lp_topheader);
relative_topheader.setId(1);
Resources resources_topheader = getResources();
Drawable drawable_topheader = resources_topheader.getDrawable(R.drawable.headerbar_m);
relative_topheader.setBackgroundDrawable(drawable_topheader);
setContentView(relative_topheader);
RelativeLayout.LayoutParams lp_banner = new RelativeLayout.LayoutParams(385, 206);
relative_banner = new RelativeLayout(this);
relative_banner.setId(2);
relative_banner.setLayoutParams(lp_banner);
lp_banner.setMargins(40, 40, 0, 0);
lp_banner.addRule(RelativeLayout.BELOW,1);
ImageView iv = new ImageView(this);
iv.setScaleType(ScaleType.FIT_XY);
iv.setLayoutParams(lp_banner);
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.banner_image);
iv.setImageBitmap(bitmap);
setContentView(iv, lp_banner);
The root view (that is, the view that you set as the content view) always fill the entire area of the window. If you want it to take only a certain part, add it to another Layout that will take the entire window.
Try this instead of the last line:
LinearLayout ll = new LinearLayout(this);
ll.addView(iv, lp_banner);
setContentView(ll);
I want to place ImageButton at x, y location of my view.
The problem is that Android adds padding around image.
Because I don't know exact size of padding, I cannot place image button at exact location.
So, I want to remove padding.
How can I remove padding around image programmatically?
button.setPadding(0, 0, 0, 0) makes button width shorter and height longer than bitmap.
button.getLayoutParams().width gives minus value.
What I tried so far is like this.
protected class MyLayout extends RelativeLayout {
Bitmap img;
ImageButton button;
public MyLayout(Context context) {
button = new ImageButton(context);
img = BitmapFactory.decodeResource(getResources(), R.drawable.img);
button.setImageBitmap(img);
params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
button.setLayoutParams(params);
params.setMargins(x, y, 0, 0);
button.setBackgroundDrawable(null);
addView(button, params);
}
}
EDIT
Use this...
MarginLayoutParams marginParams = new MarginLayoutParams(image.getLayoutParams());
int left = someValue;
int top = someValue;
marginParams.setMargins(left, top, 0, 0);
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(marginParams);
image.setLayoutParams(layoutParams);