I have a problem. I want to create 3 FrameLayouts below each other, so I created this code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#071c3f"
android:orientation="vertical">
<FrameLayout
android:id="#+id/ActionBarContainer"
android:layout_width="match_parent"
android:layout_height="75dp"/>
<FrameLayout
android:id="#+id/LayoutContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<FrameLayout
android:id="#+id/ToolBarContainer"
android:layout_width="match_parent"
android:layout_height="40dp"/>
</LinearLayout>
But this only shows the first 2 FrameLayouts and the thirth FrameLayout isn't visible. What am I doing wrong?
It's because your 2nd view is taking up all the remaining screen space (it's using "match_parent") after the first FrameLayout has been placed.
It looks like you're wanting a fixed header and footer along with a content view that fills the remaining space. So, if that assumption is true, I think this is what you are after...notice the usage of the "layout_weight" attribute and how the content view is assigned a "1" whereas the others are assigned a "0"...
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#071c3f"
android:orientation="vertical">
<FrameLayout
android:id="#+id/ActionBarContainer"
android:background="#color/red"
android:layout_width="match_parent"
android:layout_height = "75dp"
android:layout_weight = "0"/>
<FrameLayout
android:id="#+id/LayoutContainer"
android:background="#color/blue"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight = "1"/>
<FrameLayout
android:id="#+id/ToolBarContainer"
android:background="#color/green"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_weight = "0"/>
</LinearLayout>
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="red">#ffff0000</color>
<color name="blue">#ff0000ff</color>
<color name="green">#ff00ff00</color>
</resources>
Screenshot
Hope this helps!
Related
I'm really new to this and I've searched for answers but none seem relevant. When I build my android project I have an error. See at the bottom of this xml. Where do I go to find this "top level element" and why might it be incomplete?:
here code in my rowdata.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:layout_margin="5dp"
android:background="#drawable/rounded_corner">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:orientation="vertical"/>
<TextView
android:id="#+id/listID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"/>
<TextView
android:id="#+id/listJudul"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Judul Buku"
android:textSize="15sp"
android:textStyle="bold"/>
<TextView
android:id="#+id/listNama"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Nama"
android:layout_marginTop="5dp"
android:textSize="14sp"/>
<TextView
android:id="#+id/listTglPinjam"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Tgl Pinjam"
android:layout_marginTop="5dp"
android:textSize="14sp"/>
<TextView
android:id="#+id/listStatus"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Status"
android:layout_marginTop="5dp"
android:gravity="right"
android:textSize="13sp"/>
</LinearLayout>
</LinearLayout>
I have a recyclerview inside of a viewholder item that is for displaying up to 5 images nicely along with some other text. it's working pretty good except that the images are mega tiny looking, I'm not sure where I'm going wrong.
the main viewholder item layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:background="#color/white"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingTop="14dp">
<TextView
android:id="#+id/feedItem_txtTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20sp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:layout_marginTop="14dp"
android:textColor="#color/dark_gray"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/feedItem_rvImageGrid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone" />
<View
android:layout_marginTop="5dp"
android:layout_width="match_parent"
android:layout_height="15dp"
android:background="#color/very_light_gray"/>
</LinearLayout>
</LinearLayout>
the image grid viewholder item:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/feedItemImage_ivImage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="centerCrop" />
</LinearLayout>
the code I'm using to bind the grid to the recyclerview
_layoutManager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.Vertical);
_feedItemImageAdapter = new FeedItemImageAdapter(_imageUrlsVisible, _imageUrlsFull);
_rvImageGrid.SetAdapter(_feedItemImageAdapter);
_rvImageGrid.SetLayoutManager(_layoutManager);
not sure what else you'd like to see, let me know if I need to provide more code samples, I'm at a lost on what I'm doing wrong.
One possibility is that your image size itself is small.
I tried to reproduce this question by using pictures of different sizes,when the image grid viewholder item is as follows:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/feedItemImage_ivImage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="centerCrop" />
</LinearLayout>
The result is :
But we can adjust the parent properties of the ImageView to
android:layout_width="match_parent"
android:layout_height="match_parent"
So when we use the following code:
<?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">
<ImageView
android:id="#+id/feedItemImage_ivImage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="centerCrop" />
</LinearLayout>
Now,we will find the image will be adjusted to the proper size,but at the same time,the picture is distorted and blurry.
How can I place an item on the screen in a way that it doesn't move even if I scrolled ? I am using a LinearLayout.
If you're open to wrapping your LinearLayout with a RelativeLayout, this will work and is flexible in that you can make most any type of view (e.g., Button) fixed.
Layout File
<?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">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:fillViewport="false">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/txtScrollingText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
</ScrollView>
<Button
android:layout_width="600dp"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="This Button Is Fixed"/>
</RelativeLayout>
Screenshot
Solution:
Use a FloatingActionButton would work.
When you Create a new simple view Xamarin.Android project, there is FloatingActionButton sample in the activity_main.axml:
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|center"
android:layout_margin="#dimen/fab_margin"
app:srcCompat="#android:drawable/ic_dialog_email" />
And in the activity, you can customize the click event.
FloatingActionButton fab = FindViewById<FloatingActionButton>(Resource.Id.fab);
fab.Click += FabOnClick;
Here is a gif:
:
I have a little problem, which I can't seem to fix. I created a ImageButton and a TextView. They are below each other, but I want them to center vertically and horizontally. I already got it horizontally, but whatever I do.... I can't get it centering vertically (So in the middle of the screen). Here is my code:
<?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:background="#0e2a56"
android:weightSum="100">
<ImageButton
android:src="#drawable/add"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="25"
android:id="#+id/imageButton1"
android:gravity="center_vertical|center_horizontal" />
<TextView
android:text="Add project"
android:textColor="#FFFFFF"
android:textSize="35dp"
android:textStyle="bold"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minWidth="25px"
android:minHeight="25px"
android:id="#+id/textView1"
android:gravity="center_vertical|center_horizontal" />
</LinearLayout>
What am I doing wrong?
when we use a LinearLayout layout:
when android:orientation="vertical", android:layout_gravity only works for horizontal orientation, but not for vertical orientation. Left, right, and center_horizontal were rendered.
when android:orientation="horizontal", android:layout_gravity only works for vertical orientation, but not for horizontal orientation. top, bottom, center_vertical were rendered.
so if you want to center the imagebutton and textview,you could wrap them in RelativeLayout like this:
<?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="#0e2a56"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
>
<ImageButton
android:src="#drawable/add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageButton1"
/>
<TextView
android:text="Add project"
android:textColor="#FFFFFF"
android:textSize="35dp"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="25px"
android:minHeight="25px"
android:id="#+id/textView1"
/>
</LinearLayout>
</RelativeLayout>
I am building an Android TV app with the following layout:
Both lists on the left and on the right are RecyclerViews with vertical LinearLayoutManagers, Header view is static. Navigation with D-PAD works fine within one list, but when switching from one list to another there are issues. Focus moves from, say list1's item 5 to list2' item 5. When list 2 is short has less than 5 items, it just loses focus.
I want the last focused item index saved and when the user navigates list1-list2-list1 the item with that index to gain focus again and also prevent the views from losing focus. Is there any good solution to this?
Required behaviour:
user navigates to the top of the list and presses "UP" - focus stays where it was, nothing happens.
user navigates to the bottom of the list and presses "DOWN" - focus stays where it was, nothing happens.
user navigates from list1 to list2 - the item, that previously had focus in list2, gains focus or item0 gains focus if none was focused previously.
main layout:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
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"
>
<ImageView
android:id="#+id/iv_background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="false"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="27dp"
android:layout_marginLeft="48dp"
android:layout_marginRight="48dp"
android:layout_marginTop="27dp"
android:orientation="horizontal"
>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="false"
android:orientation="horizontal"
>
<ImageView
android:id="#+id/iv_poster"
android:layout_width="#dimen/episodes_list_item_height"
android:layout_height="#dimen/episodes_list_image_width"
/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
>
<TextView
android:id="#+id/tv_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/tv_release_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
/>
<TextView
android:id="#+id/tv_rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:drawableLeft="#drawable/ic_star_white_24dp"
android:drawablePadding="#dimen/view_padding_small"
/>
</FrameLayout>
<TextView
android:id="#+id/tv_description"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
/>
</LinearLayout>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_seasons_list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:focusable="false"
/>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_episodes_list"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:focusable="false"
/>
</LinearLayout>
</FrameLayout>
item layout, used for both lists:
<?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="#dimen/seasons_list_item_height"
android:orientation="horizontal"
android:focusable="true"
>
<TextView
android:id="#+id/tv_title"
android:layout_width="0dp"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:layout_weight="1"
/>
<TextView
android:id="#+id/tv_episodes_count"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:ems="10"
/>
</LinearLayout>
Digging through Google's Leanback library sources answered my payers.
If you face the same trouble, just wrap your RecyclerViews with this and don't forget to set
private boolean mPersistFocusVertical = false;
if you want the focus to be persisted when searching horizontally, like in my layout.
Modify your main layout as below.
For directional navigation we can add properties like nextFocusDown, nextFocusLeft, nextFocusRight, nextFocusUp to focus relevant items as per our requirements.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
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"
>
<ImageView
android:id="#+id/iv_background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="false"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="27dp"
android:layout_marginLeft="48dp"
android:layout_marginRight="48dp"
android:layout_marginTop="27dp"
android:orientation="horizontal"
>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="false"
android:orientation="horizontal"
>
<ImageView
android:id="#+id/iv_poster"
android:layout_width="#dimen/episodes_list_item_height"
android:layout_height="#dimen/episodes_list_image_width"
/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
>
<TextView
android:id="#+id/tv_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/tv_release_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
/>
<TextView
android:id="#+id/tv_rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:drawableLeft="#drawable/ic_star_white_24dp"
android:drawablePadding="#dimen/view_padding_small"
/>
</FrameLayout>
<TextView
android:id="#+id/tv_description"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
/>
</LinearLayout>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_seasons_list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:focusable="false"
android:nextFocusDown="#+id/rv_episodes_list"
/>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_episodes_list"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:focusable="false"
android:nextFocusUp="#+id/rv_seasons_list"
/>
</LinearLayout>
Hope this will solve your problem !!