So I'm making a simple app, where you click a button, and it displays a popup with a random string from the button.
The problem is, when the pop up window is created, its a small box. like 100x100 or something. Here is the popup code. You can see I tried setting 550, and 750, as the size, if I put 70, and 550, it will work perfectly and be really small width, and stretched long wise. But after like 100dp, it goes back to square
public void showPopup(View v){
View popupView = getLayoutInflater().inflate(R.layout.popup_layout, null);
PopupWindow popupWindow = new PopupWindow(popupView, 550, 750);
// Example: If you have a TextView inside `popup_layout.xml`
TextView tv = (TextView) popupView.findViewById(R.id.tv);
String[] myString;
Resources res = getResources();
myString = res.getStringArray(R.array.myArray);
String q = myString[rgenerator.nextInt(myString.length)];
tv.setText(q);
// Initialize more widgets from `popup_layout.xml`
// If the PopupWindow should be focusable
popupWindow.setFocusable(true);
// If you need the PopupWindow to dismiss when when touched outside
popupWindow.setBackgroundDrawable(new ColorDrawable());
// Get the View's(the one that was clicked in the Fragment) location
//v.getLocationOnScreen(location);
// Using location, the PopupWindow will be displayed right under anchorView
popupWindow.showAtLocation(v, Gravity.CENTER, 0, 0);
}
Here is my popup layout
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:background="#drawable/blank">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:id="#+id/tv"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textColor="#FFFF"
android:layout_gravity="center" />
</FrameLayout>
android:layout_width="wrap_content" android:layout_height="wrap_content"
Try match_parent instead
Related
Why does Dialog created with Binding ignores android:layout_height and layout_marginHorizontal? I guess it ignores something more, but thats what I have problems with.
Dialog Layout
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_marginHorizontal="12dp"
android:background="#color/white"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/dialogTV"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/black"
android:textSize="18sp"
android:textStyle="bold" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:src="#drawable/ic_settings_outline_28dp" />
</LinearLayout>
Java Code
Dialog defaultDialog = new Dialog(this);
defaultDialog.setContentView(R.layout.dialog_test);
defaultDialog.getWindow().setBackgroundDrawable(ContextCompat.getDrawable(this, R.drawable.dialog_background));
defaultDialog.getWindow().setLayout(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
defaultDialog.setCancelable(true);
Dialog dialogWithBinding = new Dialog(this);
DialogTestBinding dialogTestBinding = DialogTestBinding.inflate(getLayoutInflater());
dialogWithBinding.setContentView(dialogTestBinding.getRoot());
dialogWithBinding.getWindow().setBackgroundDrawable(ContextCompat.getDrawable(this, R.drawable.dialog_background));
dialogWithBinding.getWindow().setLayout(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
dialogWithBinding.setCancelable(true);
findViewById(R.id.showDefaultDialog).setOnClickListener(view -> {
TextView dialogTV = defaultDialog.findViewById(R.id.dialogTV);
dialogTV.setText("Dialog");
defaultDialog.show();
});
findViewById(R.id.showBindingDialog).setOnClickListener(view -> {
dialogTestBinding.dialogTV.setText("Dialog with Binding");
dialogWithBinding.show();
});
dialog_background is simple transparent shape
Results
The reason is because you added this line:
dialogWithBinding.getWindow().setLayout(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
The logic behind it is this line:
defaultDialog.setContentView(R.layout.dialog_test);
sets the window content view. And when you call setLayout it changes the layout_width and layout_height and overrides the values you put in the xml:
public void setLayout(int width, int height) {
final WindowManager.LayoutParams attrs = getAttributes();
attrs.width = width;
attrs.height = height;
dispatchWindowAttributesChanged(attrs);
}
So my suggestion is to remove the setLayout line of code.
I'd like to create a PopupWindow that looks like the blue one above, meaning it points to a view. How is it done?
The Popup Window I have so far doesn't point to anything and also can't be shaped to something similar to above.
popup_window.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:background="#0D47A1"
android:padding="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is what this button does..."
android:textColor="#ffffff"/>
</LinearLayout>
And in code:
myButton.setOnLongClickListener(new View.OnLongClickListener() {
#Override
public boolean onLongClick(View v) {
LayoutInflater layoutInflater = (LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View customView = layoutInflater.inflate(R.layout.popup_window,null);
//instantiate popup window
PopupWindow popupWindow = new PopupWindow(customView, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
//display the popup window
popupWindow.showAsDropDown(v);
return true;
}
});
I've achieved this with this external library that allows to customize it, it's an alternative to the other answer.
https://github.com/kcrimi/ToolTipDialog
Show a default dialog pop up banner
Align the dialog to a certain vertical location on screen
Point to a specific element on-screen
Highlight specific UI elements by letting them "peek through" a
background shade
Ok, so here's the thing. I'm trying to make an app that resembles a piano for android, also I've never really had much experience with Java or programming for Android so all of this is pretty new to me. I've managed to do this in XML but I want to make it programmaticaly so I can easily add more white and black keys also dependant of screen size. In XML it looks like this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/white1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff" />
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white2"
android:layout_toRightOf="#+id/white1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white3"
android:layout_toRightOf="#+id/white2"/>
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white4"
android:layout_toRightOf="#+id/white3"/>
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white5"
android:layout_toRightOf="#+id/white4"/>
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white6"
android:layout_toRightOf="#+id/white5"/>
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white7"
android:layout_toRightOf="#+id/white6"/>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginStart="-10dp"
android:layout_marginEnd="-6dp"
android:background="#000"
android:id="#+id/black1"
android:layout_toRightOf="#+id/white1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginLeft="-6dp"
android:layout_marginRight="-10dp"
android:background="#000"
android:id="#+id/black2"
android:layout_toRightOf="#+id/white2"/>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginLeft="-10dp"
android:layout_marginRight="-6dp"
android:background="#000"
android:id="#+id/black3"
android:layout_toRightOf="#+id/white4"/>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginLeft="-8dp"
android:layout_marginRight="-8dp"
android:background="#000"
android:id="#+id/black4"
android:layout_toRightOf="#+id/white5"/>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginLeft="-6dp"
android:layout_marginRight="-10dp"
android:background="#000"
android:id="#+id/black5"
android:layout_toRightOf="#+id/white6"/>
And now I wanted to recreate it programmaticaly, at first I've tried linear approach but first of all I was unable to make more than 7 keys, and I didn't really knew how to make black keys on top of that. So now I've went with RelativeLayout and all is fine as long as I create two buttons, then it works fine, one is next to another. But when I try to create more than two buttons they kinda make a stack.
I was trying to make some sort of array of buttons so I could easily make a loop to create destined number of buttons. Also I wanted to change the width of buttons, so if I create 8 buttons the would have the width of screen_width/8 but I'm not quite sure if it makes any sense since it's actually not doing anything when uncommented.
I would be grateful for any tips :)
public class MainActivity extends AppCompatActivity {
final int[] whitelist = {R.id.whitebt1,R.id.whitebt2,R.id.whitebt3,R.id.whitebt4,R.id.whitebt5,
R.id.whitebt6,R.id.whitebt7,R.id.whitebt8};
Button[] whiteKeys = new Button[whitelist.length];
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
Display display = getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
int width = size.x;
int height = size.y;
final RelativeLayout pianoLayout = new RelativeLayout(this);
RelativeLayout.LayoutParams whiteKeyParams1 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
whiteKeys[0] = new Button(this);
whiteKeys[0].setId(View.generateViewId());
//whiteKeys[0].setHeight(height);
//whiteKeys[0].setWidth(width/8);
whiteKeys[0].setLayoutParams(whiteKeyParams1);
pianoLayout.addView(whiteKeys[0]);
whiteKeys[1] = new Button(this);
whiteKeys[1].setId(View.generateViewId());
//whiteKeys[i].setHeight(height);
RelativeLayout.LayoutParams whiteKeyParams2 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
whiteKeyParams2.addRule(RelativeLayout.RIGHT_OF, whiteKeys[0].getId() );
whiteKeys[1].setLayoutParams(whiteKeyParams2);
pianoLayout.addView(whiteKeys[1]);
//HERE'S IS THE MOMENT WHERE I TRY TO ADD THIRD BUTTON AND THE BUTTONS START TO PILE UP
/*
whiteKeys[2] = new Button(this);
whiteKeys[2].setId(View.generateViewId());
//whiteKeys[i].setHeight(height);
//RelativeLayout.LayoutParams whiteKeyParams2 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
whiteKeyParams2.addRule(RelativeLayout.END_OF, whiteKeys[1].getId());
whiteKeys[2].setLayoutParams(whiteKeyParams2);
pianoLayout.addView(whiteKeys[2]);*/
this.setContentView(pianoLayout);
}
}
You can add 8 same size buttons using weightsum and layoutweight with LienarLayout with horizontal orientations.
see below code it may help you to add same size buttons dynamically.
/* Add a new Linearlayout as a container for the buttons */
LinearLayout linearLayout = new LinearLayout(this);
linearLayout.setOrientation(LinearLayout.HORIZONTAL);
//Added Weight Sum 8 in LinearLayout
linearLayout.setWeightSum(8);
/* Create a new Buttons in this container, for the status bar */
//below LayoutParams define with weight 1 for buttons.
LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT, 1.0f);
Button button1 = new Button(linearLayout.getContext());
button1.setLayoutParams(param);
Button button2 = new Button(linearLayout.getContext());
button2.setLayoutParams(param);
Button button3 = new Button(linearLayout.getContext());
button3.setLayoutParams(param);
Button button4 = new Button(linearLayout.getContext());
button4.setLayoutParams(param);
Button button5 = new Button(linearLayout.getContext());
button5.setLayoutParams(param);
Button button6 = new Button(linearLayout.getContext());
button6.setLayoutParams(param);
Button button7 = new Button(linearLayout.getContext());
button7.setLayoutParams(param);
Button button8 = new Button(linearLayout.getContext());
button8.setLayoutParams(param);
With your approach before adding the view to parent layout you will have to add margins for every new key also which will prevent stacking one key over another.
params.setMargins(left, top, right, bottom);
I have a problem with images. How can I bring an image in front of another one.
The problem is I create the images in code. So I can not change order in Layout.
You can use ImageView.bringToFront();, maybe is the best solution.
Here's the Tutorial
Let me know if you have any issue.
You can use RelativeLayout:
RelativeLayout rv = (RelativeLayout) findViewById(R.id.my_ph);
RelativeLayout.LayoutParams params;
ImageButton im1 = new ImageButton(this);
im1.setBackgroundResource(R.drawable.lamp);
im1.setId(i);
im1.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
TextView tx = (TextView) findViewById(R.id.textView1);
tx.setText("lamp #" + v.getId());
}
});
params = new RelativeLayout.LayoutParams(40, 40);
params.leftMargin = x;
params.topMargin = y;
rv.addView(im1, params);
XML Layout:
<RelativeLayout
android:id="#+id/my_ph"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="bottom">
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#drawable/map" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_below="#+id/image"
android:layout_alignParentLeft="true">
</TextView>
</RelativeLayout>
If you are creating images via code , you could use LayoutParams to give the second image a negative leftMargin.
RelativeLayout.LayoutParams imageParams = new RelativeLayout.LayoutParams
(RelativeLayout.LayoutParams.WRAP_CONTENT,RelativeLayout.LayoutParams.WRAP_CONTENT);
imageParams.leftMargin = -20; // change this value
imageParams.addRule(RelativeLayout.RIGHT_OF,image1.getId());
image2.setLayoutParams(imageParams);
This would force the second image on top of the first image. By changing the left margin you could decide on how much you want the second image to move over the first.
I'm building a contacts app which displays big contact photos. I need to add a label with the contacts name of each contact on top of the button (near the bottom) however I don't know how to get two views on top of each other. I cannot simply use settext since I need to add a semi-transparent background to the label.
EDIT:
I managed to get it on top but I cannot figure out how to get it on the bottom of the button.
RelativeLayout icon = new RelativeLayout(context);
// Create button
Button button = new Button(context);
button.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT));
layout.addView(button);
// Create label
TextView label = new TextView(context);
label.setText(name);
label.setBackgroundColor(Color.argb(120, 0, 0, 0));
label.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.WRAP_CONTENT));
icon.addView(button);
icon.addView(label);
However the text appears on the top of the image and I want it to be on the bottom like this:
With xml this would be something like: android:layout_alignBottom="#+id/myButton" but I'm doing this programatically and I haven't found a way to do it. How can I place my label near the button?
Try this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center" >
<Button
android:id="#+id/button1"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="right"
android:text="John"
android:background="#drawable/button_action_active" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="test textView" />
</FrameLayout>
</LinearLayout>
Dynamically you can do by
TextView lable = new TextView(this);
lable.setLayoutParams(new LayoutParams(android.widget.LinearLayout.LayoutParams.WRAP_CONTENT, android.widget.LinearLayout.LayoutParams.WRAP_CONTENT));
lable.setTextSize(25);
lable.setGravity(Gravity.CENTER);
lable.setText("John");
Button button = new Button(this);
button.setBackgroundResource(R.drawable.button_action_active);
button.setLayoutParams(new LayoutParams(android.widget.LinearLayout.LayoutParams.MATCH_PARENT, android.widget.LinearLayout.LayoutParams.WRAP_CONTENT));
FrameLayout fl = new FrameLayout(this);
fl.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
fl.addView(button);
fl.addView(lable);
setContentView(fl);
To do this you can use a frame layout. The documentation for frame layout can be found here - http://developer.android.com/reference/android/widget/FrameLayout.html
However, frame layout is depreciated (if I remember correctly). So instead I would recommend using a relative layout. In your relative layout you can set the position of the button and then give the textview the attributes android:layout_alignLeft=#id/somethingand android:layout_alignRight="#id/Something"