I am trying to build my first Amazon Fire TV app using Android Lean back library. I want to customise the BrowseFragment to look like the image shown below.
I tried setting a custom layout as below.
#Override public View onInflateTitleView(LayoutInflater inflater, ViewGroup parent,
Bundle savedInstanceState) {
View title = inflater.inflate(R.layout.custom_title_view, parent, false);
titleImageView = (AppCompatImageView) title.findViewById(R.id.title_content_thumbnail);
return title;
}
but the resulting layout is showing as shown below, with a transparent TitleView and the list rows are showing below that. Please suggest a better approach to make the UI looks similar to the first image. Couldn't find anything that could implement this.
So, I have solved this somehow. My activity_main.xml looks like 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:background="#color/default_background"
android:orientation="vertical"
>
<fragment
android:id="#+id/title_layout"
android:name="com.kalpnik.vrdevotee.fragment.MainTitleFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_alignParentTop="true"
android:layout_weight="1"
/>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/main_fragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#+id/title_layout"
android:layout_weight="1"
tools:deviceIds="tv"
/>
</LinearLayout>
In the FrameLayout I will load a fragment which extended from BrowseFragment, so this gives me the necessary rows.
And at the top, I am loading MainTitleFragment which is extended from Fragment and the layout looks like below.
fragment_main_title.xml
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:background="#000000"
android:orientation="horizontal"
>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#color/icon_background"
android:orientation="vertical"
android:paddingTop="16dp"
>
<TextView
android:id="#+id/title_content_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginHorizontal="16dp"
tools:text=""
android:textColor="#color/colorPrimaryDark"
android:textSize="28sp"
android:textStyle="bold"
/>
<TextView
android:id="#+id/title_content_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginHorizontal="16dp"
android:layout_marginTop="16dp"
android:ellipsize="end"
android:text=""
android:textSize="15sp"
/>
</LinearLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
>
<android.support.v7.widget.AppCompatImageView
android:id="#+id/title_content_thumbnail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
/>
<View
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_gravity="left|start"
android:background="#drawable/transparent_bg"
/>
<View
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_gravity="bottom"
android:background="#drawable/transparent_bg_bottom"
/>
</FrameLayout>
</LinearLayout>
And this worked for me. Hope this helps.
Related
I'm now on working with Google map of android studio and facing the problem that i cannot understand. I have 2 layout like below:
mani_activity.xml:
<?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="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:id="#+id/editTextSearch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="9"
android:backgroundTint="#color/Gray"
android:gravity="start"
android:hint="#string/search_hint"
android:imeOptions="actionSearch"
android:inputType="text"
android:maxLines="1" />
<ImageButton
android:id="#+id/imageButtonSearch"
android:layout_width="48dp"
android:layout_height="wrap_content"
app:srcCompat="#mipmap/search" />
</LinearLayout>
and map_fragment_layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<fragment
android:id="#+id/framentGoogleMap"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent">
</fragment>
<ImageView
android:id="#+id/ic_gps"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_marginRight="10dp"
android:layout_marginBottom="10dp"
android:background="#drawable/img"
android:src="#drawable/ic_gps"
android:visibility="visible" />
</RelativeLayout>
And my app like this:
In edit text belong to main_activity.xml layout ? So is it possible in Fragment can access to The MainActivity to get the id of EditText box ?
Yes, you can do it by using
View view = getActivity().findViewById(R.id.editTextSearch)
This gives you the view which then you can convert it to any view you need like
if(view instanceof EditText) {
editTextSearch = (EditText) view;
//TODO do something with this
}
Developer docs: Communicating with activity
I have a LinearLayout which I'm trying to make VISIBLE, then GONE, then VISIBLE again. However after making it GONE, it doesn't become visible again. As a note, it works fine if I make it INVISIBLE: it appears and disappears with no problem.
These are my files:
<?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">
<LinearLayout
android:id="#+id/noconnectionll"
android:visibility="gone"
android:padding="#dimen/node_default_spacing"
android:background="#color/category_no_internet"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="#string/no_internet_short"
android:textColor="#fff"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"/>
<Button
android:id="#+id/no_connection_retry"
android:text="#string/try_again"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
<ListView
android:dividerHeight="0dp"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<LinearLayout
android:id="#+id/spinner_wrapper"
tools:visibility="visible"
android:visibility="invisible"
android:background="#a0ffffff"
android:gravity="center_horizontal|center_vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/spinner"
android:src="#drawable/ic_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/category_loading"
android:text="#string/loading"
android:textColor="#000"
android:padding="#dimen/activity_padding"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
This is the method I'm using to show/hide:
private void hideOrShowLoading(final boolean show) {
final ViewGroup spinnerWrapper = (ViewGroup)ll.findViewById(R.id.spinner_wrapper);
final View spinner = ll.findViewById(R.id.spinner);
if (show) {
spinnerWrapper.setVisibility(View.VISIBLE); // Not working after being set to GONE previously
final Animation rotation = AnimationUtils.loadAnimation(getContext(), R.anim.rotate);
rotation.setFillAfter(true);
spinner.startAnimation(rotation);
} else {
spinnerWrapper.setVisibility(View.GONE);
spinner.clearAnimation();
}
}
Any tips? Could it have something to do with the ListView above it having a height of 0 and a weight of 1?
Thanks
Update
I also tried the following after the if (show) block, with no luck:
listview.invalidate();
spinnerWrapper.invalidate();
ll.invalidate();
ll.requestLayout();
ll is the LinearLayout that contains both.
While I believe this is caused by the layout_weight=1 property, I wasn't able to properly fix this.
The following hack did work. Basically, I'm surrounding the spinnerWrapper in another linear layout which is always visible.
<?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">
<LinearLayout
android:id="#+id/noconnectionll"
tools:visibility="visible"
android:visibility="gone"
android:padding="#dimen/node_default_spacing"
android:background="#color/category_no_internet"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="#string/no_internet_short"
android:textColor="#fff"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"/>
<Button
android:id="#+id/no_connection_retry"
android:text="#string/try_again"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
<ListView
tools:background="#d496d4"
android:dividerHeight="0dp"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<!-- Weird bug with layout_weight=1 on the listview above means we need this linearlayout -->
<LinearLayout
android:background="#0ca917"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/spinner_wrapper"
android:background="#a0ffffff"
android:gravity="center_horizontal|center_vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/spinner"
android:src="#drawable/ic_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/category_loading"
android:text="#string/loading"
android:textColor="#000"
android:padding="#dimen/activity_padding"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I want the last viewgroup with ID chats to overlap the previous viewgroups and occupy the whole screen of my phone. With the XML code below I presume it will get what I want. But the codes does not. Please help.
Below is the xml codes.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/root"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.testapp.MainActivity">
<LinearLayout
android:id="#+id/bar"
android:layout_alignParentStart="true"
android:orientation="horizontal"
android:gravity="center_vertical"
android:background="#999999"
android:elevation="10dp"
android:layout_width="match_parent"
android:layout_height="40dp">
<ImageView
android:id="#+id/bar_img"
android:src="#drawable/ic_autorenew_black_24dp"
android:gravity="clip_vertical"
android:paddingStart="8dp"
android:layout_width="36dp"
android:layout_height="36dp" />
<TextView
android:id="#+id/bar_title"
android:text="title"
android:ellipsize="end"
android:layout_weight="1"
android:gravity="center"
android:textColor="#ffffff"
android:textStyle="bold"
android:textSize="18sp"
android:layout_width="0dp"
android:layout_height="wrap_content" />
</LinearLayout>
<FrameLayout
android:id="#+id/root_frag"
android:layout_below="#id/bar"
android:layout_width="match_parent"
android:layout_height="match_parent"></FrameLayout>
<LinearLayout
android:id="#+id/chats"
android:background="#ea2312"
android:orientation="vertical"
android:layout_alignParentStart="true"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/chat_list"
android:orientation="vertical"
android:layout_width`enter code here`="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="hello world"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
this is the preview screenshot.
enter image description here
The "chats" LinearLayout does fill the whole screen, but the "bar" LinearLayout appears on top of it (even though it's defined earlier inside the RelativeLayout) because of its android:elevation attribute.
To make this stop, either remove the elevation attr from the "bar" view, or add a (larger) elevation attr to the "chats" view.
I have layount who include one layout, duplicate two time ("include"):
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorButtonNiebieski">
<!-- LAYOUT GRACZ (A) -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1.0"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.45"
android:scaleY="-1"
android:scaleX="-1"
android:paddingBottom="10dp">
<include
android:id="#+id/lay1"
layout="#layout/layout_pojedynek_duplikat" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.05"
android:gravity="center"
android:scaleY="-1"
android:scaleX="-1">
<TextView
android:id="#+id/txt_gracz_A_liczba_punktow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2"
android:textSize="30dp"
android:textColor="#color/colorWhite"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.05"
android:gravity="center">
<TextView
android:id="#+id/txt_gracz_B_liczba_punktow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="7"
android:textSize="30dp"
android:textColor="#color/colorWhite"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.45"
android:paddingBottom="10dp">
<include
android:id="#+id/lay2"
layout="#layout/layout_pojedynek_duplikat" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
layout_pojedynek_duplikat.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:weightSum="1.0">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1.0"
android:weightSum="1.0"
android:background="#00ff0000"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.3"
android:gravity="center">
<TextView
android:id="#+id/txt_gracz_A_i_B_nazwa"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="POLSKA"
android:textSize="40dp"
android:textColor="#color/colorWhite"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.7"
android:gravity="center">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="1.0">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1.0"
android:layout_weight="0.5"
android:orientation="horizontal">
<ImageView
android:id="#+id/img_pojedynek_wariant_A"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:src="#drawable/argentyna"
android:padding="5dp"
android:adjustViewBounds="true"/>
<ImageView
android:id="#+id/img_pojedynek_wariant_B"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:src="#drawable/kambodza"
android:padding="5dp"
android:adjustViewBounds="true"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1.0"
android:layout_weight="0.5"
android:orientation="horizontal">
<ImageView
android:id="#+id/img_pojedynek_wariant_C"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:src="#drawable/watykan"
android:padding="5dp"
android:adjustViewBounds="true"/>
<ImageView
android:id="#+id/img_pojedynek_wariant_D"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:src="#drawable/polska"
android:padding="5dp"
android:adjustViewBounds="true"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
In java file I try set font for txt_gracz_A_i_B_nazwa text field:
TextView txt_gracz_A_i_B_nazwa = (TextView) findViewById(R.id.txt_gracz_A_i_B_nazwa);
txt_gracz_A_i_B_nazwa.setTypeface(myFontBold);
But this set font for only one view:
How can I fix this problem?
DO that for every view. Or create a new View class that's a child of TextView and sets the font, and use that instead of TextView.
Yes, Android's font handling sucks.
When you call Activity.findViewById(), the system will traverse your view hierarchy starting from the root until it finds a view with the given id. In other words, Activity.findViewById() will return the first view with that id in your layout. It will not return all views with that id.
For this reason, it is generally advised to not re-use ids within a single layout. However, this advice is often not practical, and you shouldn't feel bad about your current layout. But it does mean that you will need to call TextView.setTypeface() twice, and that you will need some way to access the second view with the id txt_gracz_A_i_B_nazwa.
You can do this by limiting the scope you search with findViewById(). Instead of using Activity.findViewById(), instead use View.findViewById(). So you could write something like this:
View lay1 = findViewById(R.id.lay1);
TextView txt1 = (TextView) lay1.findViewById(R.id.txt_gracz_A_i_B_nazwa);
txt1.setTypeface(myFontBold);
View lay2 = findViewById(R.id.lay2);
TextView txt2 = (TextView) lay2.findViewById(R.id.txt_gracz_A_i_B_nazwa);
txt2.setTypeface(myFontBold);
Looks like a small logic flaw. The problem with reusing the same layout two times, is that you have the identical IDs although they represent two entirely different UI elements.
lay1.findViewById(your_text_field_id).setFontType
lay2.findViewById(your_text_field_id).setFontType
Should fix you. You can't use generic findViewById as it will grab the first one and use it. Hope that helps.
I am trying to include a view under a TextView, the TextView shows up in the graphical Layout but not the View. I have attached the code and the graphical layout. Can anyone please help me, whats the wrong and how can i solve it...
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
tools:context="com.example.dt_4000.MainActivity"
tools:ignore="MergeRootFrame"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right|center_vertical"
android:text="DT-4000"
android:textColor="#BA0"
android:textSize="36sp" />
<View
android:id="#+id/view1"
android:layout_width="wrap_content"
android:layout_height="16dip"
android:background="#F90"
/>
</LinearLayout>
Try this code it may solve your problem
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
tools:context="com.example.dt_4000.MainActivity"
tools:ignore="MergeRootFrame"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right|center_vertical"
android:text="DT-4000"
android:textColor="#BA0"
android:textSize="36sp" />
<View
android:id="#+id/view1"
android:layout_width="wrap_content"
android:layout_height="16dip"
android:background="#F90"
/>
</LinearLayout>
Your TextView has width: android:layout_width="match_parent" it occupies the whole width and your LinearLayout has orientation="horizontal" which will place the views side by side (horizontally)...BUT the first view (TextView) is already taking all the space...as it has android:layout_width="match_parent"...so no space left for its buddy a.k.a. #+id/view1
To fix it, you can either change:
<LinearLayout ...
android:orientation="vertical" ....
OR
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content" ....