Android clickable layout

Question

I've got a linear layout that i have set true to be clikable + focus, But the problem is there is no focus displayed when clicked. How can i get the focus to be displayed.

Heres my code

<LinearLayout
  android:id="@+id/linear_tv_layout"
  android:orientation="horizontal"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:layout_weight="1"
  android:clickable="true"
  android:focusable="true"
  android:paddingBottom="7px">

Answer 1

I think you need to set as background for the clickable view (the layout) a state list drawable , it's a drawable resource for which you can specify different drawables for different states or combinations of states, there's one for selection, one for pression and so on. Also, the state of a layout propagates to all its children.

---

CLARIFICATIONS - this is the example from the previously linked docs:

res/drawable/button.xml : (it's the state list drawable)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true"
          android:drawable="@drawable/button_pressed" /> <!-- pressed -->
    <item android:state_focused="true"
          android:drawable="@drawable/button_focused" /> <!-- focused -->
    <item android:drawable="@drawable/button_normal" /> <!-- default -->
</selector>

button_pressed, button_focused and button_normal are normal drawables representing the button in those states, probably png's (so pressed could be inset, focused highlighted in orange).

if you set this resource as background to your "linear layout button":

<LinearLayout
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:background="@drawable/button">
    ...
</LinearLayout>

now focusing the layout will automatically set its background image to @drawable/button_focused, and so on.

of course, all the drawables you use must already be resources in res/drawable/, together with button.xml.

Answer 2

To apply material design's button press animation to any element, set the element's android background attribute to:

android:background="?android:attr/selectableItemBackground"

In your case:

<LinearLayout
  android:id="@+id/linear_tv_layout"
  android:orientation="horizontal"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:layout_weight="1"
  android:clickable="true"
  android:focusable="true"
  android:paddingBottom="7px"
  android:background="?android:attr/selectableItemBackground">

Answer 3

@danLeon: Instead of android:background="@android:drawable/btn_default"

you should use
android:background="@android:drawable/list_selector_background"

former will modify the UI as well, which is not required.

Answer 4

Try to bring that layout to front in code:

public void onCreate(Bundle savedInstanceState) 
{
    super.onCreate(savedInstanceState);

    View mainView = this.findViewById(R.id.mainView);
    this.setContentView(mainView);

    LinearLayout linear_tv_layout = (LinearLayout)mainView.findViewById(R.id.linear_tv_layout);
    linear_tv_layout.bringToFront();
    // or: mainView.bringChildToFront(linear_tv_layout);
}

If that does not work, check if there is one or more view overlapped over that LinearLayout.

Answer 5

Heres a sample layout may be this can give you some idea:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
  android:background="@android:drawable/btn_default"
  android:clickable="true"
  android:focusable="true"
  android:layout_width="fill_parent"
  android:layout_height="0dip"
  android:layout_weight="1"
  >

  <ImageView
    android:id="@+id/image"
    android:src="@android:drawable/star_big_on"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    />

</LinearLayout>

<LinearLayout
  android:background="@android:drawable/btn_default"
  android:clickable="true"
  android:focusable="true"
  android:layout_width="fill_parent"
  android:layout_height="0dip"
  android:layout_weight="1"
  >

  <ImageView
    android:id="@+id/image"
    android:src="@android:drawable/star_big_on"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    />

</LinearLayout>
</LinearLayout>

Answer 6

A simple way is by setting this attribute: android:background="@android:drawable/btn_default"

<LinearLayout
  android:id="@+id/linear_tv_layout"
  android:orientation="horizontal"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:layout_weight="1"
  android:clickable="true"
  android:focusable="true"
  android:paddingBottom="7px"
  android:background="@android:drawable/btn_default"
  >