add buttons dynamically based on screen size - android

I have about 10 buttons, and these 10 should be displayed based on the screen width. If the screen width is lesser, then a "more" button should be displayed and on click of more , the remaining buttons should be displayed as a pop up on more button.
I have tried this
Add Buttons dynamically depending on screen width
But width consideration is troubling me.. Could some one help me out in this regard

Following code may help you
Display display =((WindowManager)activityContext.getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
DisplayWidth = display.getWidth();
DisplayHeight = display.getHeight();
if(DisplayHeight > DisplayWidth)
{
ButtonWidth = (6 * DisplayWidth) / 7 ;
ButtonHeight = (4 * DisplayHeight) / 5 ;
}
else
{
ButtonWidth = (6 * DisplayWidth) / 9 ;
ButtonHeight = (4 * DisplayHeight) / 5 ;
}
Divide and multiply display width and height as per your requirement and set as button width and height.

Related

Android grid of dots to fill View

I'm trying to make a game in Android Studio using Kotlin, currently I have a grid drawn using two for loops (1 for cols and 1 for rows) that draws dots. I want the dots to fill the View, without the blank space around the grid. Any ideas?
val columns = 5
val rows = 5
var xPos: Float = width / (columns + 1)
var yPos: Float = height / (rows + 1)
for (col in 1..columns) {
for (row in 1..rows) {
canvas.drawPoint(col*xPos, row*yPos, paint)
}
}
What I get:
d
What I want:
You need a little space around the edges. So you can have a variable for padding, which should be half the diameter of your dots plus however many pixels of white you want around them. You would probably calculate the size using a constant DIP unit and the screen density, same as you probably did for your paint to get the dot diameter.
Then you can use the padding in your calculation. For example, if you have five columns, to get the space between dots, you want to divide the width by four, after subtracting the padding from both sides.
val padding = /* ... */
val columns = 5
val rows = 5
val hSpacing = (width - (2 * padding)) / (columns - 1)
val vSpacing = (height - (2 * padding)) / (rows - 1)
for (i in 0..columns)
for (j in 0..rows)
canvas.drawPoint(padding + i * hSpacing, padding + j * vSpacing, paint)

StaggeredGridLayoutManager left a gap before a full span element

I have a RecyclerView with a StaggeredGridLayoutManager.
The problem is that before a full span element there is a gap that I need to fill, increasing/decreasing the height of the last two elements.
A picture of the problem:
Just 2 columns are required.
The elements of the grid can have different heights.
I'm trying to calculate the height of the two columns using each element height, and at the end see which column is longer, and add height to the shortest, but I don't know where is a safe place to set the new height. When I know for sure the height of the view is the one is going to be draw.
I'm stuck for days with this problem, any suggestions are welcome!
onBindViewHolder
double positionHeight = getPositionRatio(position);
holder.img_event).setHeightRatio(positionHeight);
private double getPositionRatio(final int position) {
double ratio = sPositionHeightRatios.get(position, 0.0);
// if not yet done generate and stash the columns height
// in our real world scenario this will be determined by
// some match based on the known height and width of the image
// and maybe a helpful way to get the column height!
if (ratio == 0) {
ratio = getRandomHeightRatio();
sPositionHeightRatios.append(position, ratio);
Log.d("'", "getPositionRatio:" + position + " ratio:" + ratio);
}
return ratio;
}
private final Random mRandom = new Random();
private double getRandomHeightRatio() {
return (mRandom.nextDouble() / 2.0) + 1.0; // height will be 1.0 - 1.5 the width
}

Image layout not working correctly

I am setting an image programatically so it looks like circle but it looks like oval shape in some devices.
my code is-
int circleLeft = (int) (width * 3.3) / 100;
circleLayoutParams.setMargins(circleLeft, (int) (height * 0.29),
circleLeft, (int) (height * 0.18));
circleMenu.setLayoutParams(circleLayoutParams);
xml-
<com.example.converter.view.CircleLayout
android:id="#+id/main_circle_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_gravity="center_horizontal"
android:background="#drawable/glow_circle"/>
i have put images in drawable folder.what is wrong with this code.is it image size problem?
I encountered same problem in my app. It is because variation of PPI and Screen size of different devices. I solved it by getting screen size. It can be done by following code:-
//method to get screen size
public ArrayList<Integer> GetDeviceScreenSize()
{
ArrayList<Integer> size= new ArrayList<Integer>();
if((android.os.Build.VERSION.SDK_INT >= 13)){
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
int w = metrics.widthPixels;
int h = metrics.heightPixels;
size.add(0,w);
size.add(1,h);
}else{
Display display = ((WindowManager)ctx.getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
int width = display.getWidth();
int height = display.getHeight();
size.add(0, width);
size.add(1,height);
}
return size;
}
After you get device screen size through this method, you can set height and width of some part of height and width you got from this method. It should be like:-
ArrayList<Integer> size= GetDeviceScreenSize();
float width = (( (float)size.get(0))/320)*135;
int circleLeft = (int) (width * 3.3) / 100;
Remember, you'll have to try dividing and multiplying the device width and height with different units to get the exact size that you want, but once you get it, It will work on all devices, no matter what is there screen size.

How can I resize an Android UI element during onLayout?

I have a button class based on a LinearLayout that contains two TextViews, and I want the button always to be square (which I'm doing using onMeasure()), and the upper of the TextViews to resize automatically to fit the button. I want the lower TextView to have fixed-size text, so it looks roughly like
|---------|
| |
| 1 8 0 |
| |
| foo |
|---------|
with "180" being as large as possible in the available space.
I'm calling a function in onLayout() called adjustTextSize():
private void adjustTextSize() {
float height = mHeight - mTitleView.getMeasuredHeight() - 4 * mPadding - getPaddingTop() - getPaddingBottom(); //title text view
int numberheight = (int) (height * 0.75);
int extravertpadding = 0;//(int) (height * 0.125);
mTitleView.setPadding(mPadding, 0, mPadding, mPadding);
mNumberView.setTextSize(TypedValue.COMPLEX_UNIT_PX, numberheight);
mNumberView.setPadding(mPadding, mPadding + extravertpadding, mPadding, mPadding + extravertpadding);
if(mNumberView.getMeasuredWidth() > mWidth) {
float reduction = mWidth / mNumberView.getMeasuredWidth();
extravertpadding = (int) ((numberheight - height*reduction) / 2);
numberheight = (int) (height*reduction);
mNumberView.setTextSize(TypedValue.COMPLEX_UNIT_PX, numberheight);
mNumberView.setPadding(mPadding, mPadding + extravertpadding, mPadding, mPadding + extravertpadding);
}
mNumberView.setTextSize(TypedValue.COMPLEX_UNIT_PX, numberheight);
mNumberView.setPadding(mPadding, mPadding + extravertpadding, mPadding, mPadding + extravertpadding);
}
mWidth and mHeight are set in onLayout().
However, I have two initial problems: firstly, setting the text size to a certain pixel value makes the View somewhat bigger than the pixel value. I want to work out how large to set the text height to fit the available space; three quarters seems to work OK but I would rather have an exact value.
The second problem is that the value of getMeasuredWidth() seems not to be changing after I've changed the text size. Why not?
Answer to part 2:
It's necessary to call
mNumberView.measure(
MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED),
MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED)
);
to tell the system to measure the view as though there were no constraints on its size. After this has been called you can find out how large the view would be if space were no object and scale it down accordingly.

how to fix the text size dynamically for different screen resolutions on android

i have a home screen with header and footer and in between i have ten rows of text to display. the text size is hard coded in java but when i run the app the footer gets stretched to adjust with the text size fixed. but it looks odd when it gets stretched. is there a way to assign the text size dynamically based on the screen. please help me with this, if you could look at the image you will understand the footer problem.
if (dpiClassification == DisplayMetrics.DENSITY_HIGH) {
if (isTablet) {
textSize = (int) (((d.getHeight() - (totImageHeight)) / 10) - (25 * dm.density));
} else {
textSize = (int) (((d.getHeight() - (totImageHeight)) / 10) - (11 * dm.density));
}
} else if (dpiClassification == DisplayMetrics.DENSITY_MEDIUM) {
if (isTablet) {
textSize = 90;// (int) (((d.getHeight() - (totImageHeight)) /
// 10) - (15 * dm.density));
} else {
textSize = (int) (((d.getHeight() - (totImageHeight)) / 10));
}
} else {
textSize = (int) (((d.getHeight() - (totImageHeight)) / 10));
}
Try to set your text size in DP and dynamically convert DP to PX and put this PX values in
*.textSize(pxValue);
To convert I use next Code:
private static DisplayMetrics metrics = null;
private static float density = 0.0;
private int dpToPxConverter(Context context, int dp){
if (metrics == null) {
metrics = context.getResources().getDisplayMetrics();
density = metrics.density;
}
return (int) (density * dp + 0.5f);
}
Hope it help you!

Categories

Resources