Develop Reference

LinearLayout being used as button stuck in pressed state

I'm building a custom layout for a phone dialer. For each number in the dialer i'm using a LinearLayout with some TextViews inside it.
Problem: When an onClickListener is set to the custom LinearLayout and it is subsequently pressed by the user, it gets stuck in the pressed state and does not revert to the default item in the state list when released. If I don't set an onClickListener to the LinearLayout, the state correctly changes to pressed and then unpressed.
Debugging via Android Studio's layout inspector shows that the LinearLayout still has isPressed() == true after the user has released. I've also tried an ImageButton and Button instead of the LinearLayout and it exhibits similar behavior. The app's theme inherits from Theme.MaterialComponents.Light.Bridge.
The layout of the fragment containing the dialer buttons:
<TableLayout
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_gravity="center_horizontal"
android:layout_weight="2">
<TableRow
android:layout_height="0px"
android:layout_weight="1"
android:gravity="center">
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#e2e2e2"/>
<DialerButton
android:id="#+id/keypad2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"/>
...
The LinearLayout used for the DialerButton class (which is a basic class that just overrides LinearLayout and inflates the following layout) looks like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:background="#drawable/dialpad_btn_background"
android:clickable="true"
android:focusable="true">
<TextView
android:id="#+id/tvNumeral"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:text="2"/>
<TextView
android:id="#+id/tvLettering"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:text="ABC"/>
</LinearLayout>
The dialpad_btn_background.xml looks like this:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#color/dark_grey"/>
<item android:drawable="#color/white"/>
</selector>
The code to attach the OnClickListener to the LinearLayout is standard:
keypad1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View arg0) {
/// ... Do work ...
}
});

It is better to use ImageButton instead of a whole LinearLayout as ImageButton will automatically have this feature or if you are concerned about the design you should use the card layout.This is a calculator where I've used Imagebutton for the keys.

I wasn't able to find a way to fix this using layouts, but I was able to get around it programatically. This doesn't address the root of why the LinearLayouts or the ImageButtons were getting stuck in the pressed state though, or why the state list was not working as expected.
First, I went back to using ImageButton instead of a custom LinearLayout since that made no difference with regards to the pressed state. By attaching a touch listener and programmatically setting the background of the ImageButtons on MotionEvent.ACTION_UP and MotionEvent.ACTION_DOWN, I got the results I need. Here's the snippet for how I did this:
View.OnTouchListener touchListener = (v, event) -> {
if (event.getAction() == MotionEvent.ACTION_UP) {
v.setBackground(getResources().getDrawable(R.drawable.img_dialpad_bg, null));
}
else if (event.getAction() == MotionEvent.ACTION_DOWN) {
v.setBackground(getResources().getDrawable(R.drawable.img_dialpad_bg_pressed, null));
}
return false;
};
keypad0.setOnTouchListener(touchListener);
keypad1.setOnTouchListener(touchListener);
...

Set Buttons over ImageView - Android

I have a FlowLayout where a user can add tastes, like, music, games, sport, etc. After user informs what he wants to add, he clicks a button to display it in a flow layout, so, this process must be done programmatically. Create an image, set drawable and size. I did some of it. But now I need to display an imageview along with a button so a user can remove added taste. I think creating this process in xml will not help, because user may not add any tastes.
What I've already done:
What I must do:
Method I'm using:
ImageView iconLike = new ImageView(Register30.this);
iconLike.setImageResource(getIconLike(like));
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(getSizeIconLike());
lp.setMargins(5,5,5,5);
iconLike.setLayoutParams(lp);
Like newLike = new Like();
newLike.setIcon(iconLike);
newLike.setGenderFather(null);
newLike.setGenderChild(null);
newLike.setName(like);
likes.add(newLike);
likesContainer.addView(iconLike);

Add in the xml 2 texts view with background of a circle
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageButton
android:id="#+id/taste"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/remove"
android:layout_width="width you want"
android:layout_height="height you want"
android:gravity="center"
android:layout_gravity="end"
android:background="#drawable/circle_background_with
_your_color"
android:visibility="gone"/>
<TextView
android:id="#+id/add"
android:layout_width="width you want"
android:layout_height="height you want"
android:gravity="center"
android:layout_gravity="start"
android:background="#drawable/circle_background_with
_your_color"
android:visibility="gone"/>
</FrameLayout>
when the user long clicks on a taste just change the visibility of the texts views. You need to set in the tastes adapter to every taste a longclick function. In this function you toggle between the states.

Android Button always takes two clicks to fire onClick()

I have a RelativeLayout inside of a ScrollView that contains a Button and some TextViews and EditTexts.
In my xml layout file, I am defining android:onClick but it always takes two clicks of the button to fire the event. The button always gets the focus on the first click and fires the onClick event on the second click. I have tried setting focusable and focusableInTouchMode both to false but the behavior doesn't change.
Here is my layout file:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context=".DensityActivity" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
...
<TextView
...
<TextView
...
<EditText
...
<Button
android:id="#+id/ad_button_calculate"
android:layout_width="112dp"
android:layout_height="wrap_content"
android:layout_below="#id/ad_edit_obs_temp"
android:layout_alignParentRight="true"
android:layout_marginTop="20pt"
android:paddingLeft="6pt"
android:onClick="onClick"
android:focusable="false"
android:focusableInTouchMode="false"
android:text="#string/button_calculate" />
<TextView
...
</RelativeLayout>
</ScrollView>
Any ideas or suggestions as to why the focusable and focusableInTouchMode don't seem to do anything?
I thought it might be my onClick() method not doing what it should so I reduced it to something simple just to see and it behaves the same. Here is my simplified onClick():
public void onClick(View view) {
new AlertDialog.Builder(this).setTitle("Argh").setMessage("Watch out!").setNeutralButton("Close", null).show();
}

OK, I found it. It was, of course, my own mistake.
At the end of my onCreate method I was doing this:
// Set the focus to the calculate button so the keyboard won't show up automatically
Button calcButton = (Button)findViewById( R.id.ac_button_calculate );
calcButton.setFocusable( true );
calcButton.setFocusableInTouchMode( true );
calcButton.requestFocus();
So of course, no matter what I did in my xml file, I was overriding it in my code.
Instead, I used this to hide the keyboard:
getWindow().setSoftInputMode( WindowManager.LayoutParams.SOFT_INPUT_STATE_HIDDEN );
Which works great.

Align a Button with an Image inside another Layout

Apologies for the confusing header. My problem is explained better in the following image:
I need the green Button to be aligned with the top of the Image, but the Image is inside another Layout. Is this possible?
It can be done in code if necessary; XML is not required. I am targeting Android 2.2 and newer.
EDIT:
My current implementation is to simply set the MarginTop-property of the Button, but this is inconvenient when I need to change the sizes of the text inside the LinearLayout, which I plan to do depending on the screen size.
I think it can be solved by somehow finding the Y coordinate of the Image, perhaps by adding the heights of the TextViews, and then setting this as the MarginTop for the Button, but this sounds cumbersome. Is there really no other option?
The LinearLayout is going to be placed inside a ViewPager (with multiple views, all having an image in the same position), which is why I can't do it the way preeya explains.

It's possible but more complicated than including the button into the same layout. If you definitely don't want to do that, you can't use XML (which is always faster). You have to do 3 steps in your code:
1.) Wait until the view is drawn
private void waitForViewToBeDrawn(){
// get your layout
final RelativeLayout mainLayout = (RelativeLayout) findViewById(R.id.mainLayout);
ViewTreeObserver vto = mainLayout.getViewTreeObserver();
// add a listener
vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
public void onGlobalLayout() {
// you also want to remove that listener
mainLayout.getViewTreeObserver().removeGlobalOnLayoutListener(this);
// go on to next step
getPositionOfImageView();
}
});
}
That approach works best for me, but if you have troubles - here are some alternatives.
There are also [more solutions][2] out there when you use API level 11 and higher...
2.) Get the top-position of your imageView
private void getPositionOfImageView(){
ImageView imageView = (ImageView) findViewById(R.id.imageView);
// Top position view relative to parent (Button and ImageView have same parent)
int topCoordinate = imageView.getTop();
adjustButton(topCoordinate);
}
3.) Add or adjust the button in order to be aligned with the image
public void adjustButton(int topCoordinate){
Button button = (Button) findViewById(R.id.button);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
params.topMargin = topCoordinate;
button.setLayoutParams(params);
}
This step would be smoother by using API 11: button.setTop(topCoordinate)
Of course you can shorten all of it and put it in a singele method, just thought that 3 steps are better to explain. Hope that code helps to get started!

U can use linearlayout for displaying image & button as follows :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/longText"
android:gravity="center"
android:text="Some very long text" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:id="#+id/subtitle"
android:layout_below="#+id/longText"
android:text="subtitle" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_below="#+id/subtitle"
android:layout_toLeftOf="#+id/subtitle"
android:layout_height="wrap_content"
android:text="button" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/button1"
android:layout_below="#+id/subtitle"
android:orientation="horizontal"
>
<ImageView
android:id="#+id/imageView2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
</LinearLayout>
</RelativeLayout>

Detect click on screen when in landscape

I'm having some trouble with detecting screen clicks on the GUI. Works in portrait but fails in landscape, see below.
I have a GUI (Fragment) which contains some instructions + images. The user is required to tap anywhere on the screen to proceed. In order capture the click/tap event, I have put in a View(topview) that fill the entire screen and sits onto of other elements, I then listen for clicks on this view and it works fine.
The problem is when in landscape mode, the text and images take up to much room. So the whole thing is now wrapped in a ScrollView. This is where the problem begins. When the ScrollView is active, (i.e. you can scroll/scroll bars are visible), my view on top (topview) disappears. It seems that when in landscape mode the height of content in a ScrollView is being changed. As an experiment I replaced the View with a Button and the Button goes from filling the screen in portrait to being normal height in landscape mode when the ScrollView is usable.
Is there a way of me detecting the user tapping on the screen, which works with the ScrollView control as the top element. I've tried rearranging the GUI in several ways but without success, and I've tried adding onClick event handlers to the ScrollView, also without success.
My Layout is below, note my top view is semi-transparent red, so I could see the area it covered.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:clickable="true" >
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="vertical" >
<TextView
android:id="#+id/txtInstructions"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center_vertical"
android:padding="10dp"
android:text="#string/instructions"
android:textColor="#color/blue"
android:textSize="20sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:maxWidth="250dp"
android:padding="20dp"
android:src="#drawable/main_camera" />
</LinearLayout>
<View
android:id="#+id/view_to_listen_for_touch"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#88FF0000"
android:clickable="true" />
</RelativeLayout>

One thing that works(although looks like more like a hack(pretty ugly)) is to programatically add the special View in code(in the onCreate method) and set its dimensions based on the parent RelativeLayout's exact dimensions. Here is a snippet of code:
//...
final RelativeLayout parent = (RelativeLayout) findViewById(R.id.ff);
final View layer = new View(this);
layer.setBackgroundColor(Color.parseColor("#88FF0000"));
// the ScrollView really doesn't like this View ,using this without the
// runnable will not work
layer.setLayoutParams(new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.MATCH_PARENT,
RelativeLayout.LayoutParams.MATCH_PARENT));
layer.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
Toast.makeText(getApplicationContext(), "SDFD",
Toast.LENGTH_SHORT).show();
}
});
parent.addView(layer);
// this is required because if we use directly the getWidth/getHeight we
// will get 0/0
layer.post(new Runnable() {
#Override
public void run() {
layer.setLayoutParams(new RelativeLayout.LayoutParams(parent
.getWidth(), parent.getHeight()));
}
});
//...