Android Wear: Layout is not displaying properly in Emulator - java

I'm developing an Android smart watch application. The initial screen appears fine. But, when I go to next screen, the upper part pops up with the name of project something like this. In the below image, Watch is the name of the project.
I want to see the entire screen instead of white space which contains project's name. Does anyone know how to solve it and why is it appearing?
My XML file is
<?xml version="1.0" encoding="utf-8"?>
<android.support.wear.widget.BoxInsetLayout 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:orientation="vertical"
tools:deviceIds="wear">
<LinearLayout
android:id="#+id/mainContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/black"
android:weightSum="1"
tools:ignore="UselessParent"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true">
<LinearLayout
android:id="#+id/sign_up_top_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:layout_marginTop="15dp">
<TextView
android:id="#+id/textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="5dp"
android:textAlignment="center"
android:textSize="18sp"
android:text="#string/text"
android:background="#color/black"
android:textColor="#color/white"
android:fontFamily="Century-Gothic.ttf" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="18dp"
android:layout_height="19dp"
android:layout_toRightOf="#+id/text"
android:src="#drawable/fingerprint" />
</LinearLayout>
<Button
android:layout_marginTop="10dp"
android:id="#+id/button"
android:background ="#drawable/roundedbutton"
android:text="#string/button_text"
android:layout_width="108dp"
android:textAlignment="center"
android:drawablePadding="20dp"
android:layout_gravity="center"
android:textColor="#color/white"
android:layout_height="75dp"
android:layout_weight="0.34" />
</LinearLayout>
</android.support.wear.widget.BoxInsetLayout>

Use a BoxInsetLayout for your root layout:
This class applies the required window insets depending on the screen
shape and lets you easily align views on the center or near the edges
of the screen.
And I would highly recommend you to read through this tutorial.
Edit 2:
You need to use:
android.support.wearable.view.BoxInsetLayout
not:
android.support.wear.widget.BoxInsetLayout
and add to the mainContainer:
app:layout_box="all"
<android.support.wearable.view.BoxInsetLayout
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:orientation="vertical"
tools:deviceIds="wear">
<LinearLayout
app:layout_box="all"
android:id="#+id/mainContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/black"
android:weightSum="1"
tools:ignore="UselessParent"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true">

The answer to the question was simple. I figured out after one day. I changed my theme from Theme.AppCompat.Light to Theme.AppCompat.Light.NoActionBar in Manifest file. The program name bar disappeared.

Related

There is a jerk when I set visibility GONE for this button

I am using android:animateLayoutChanges="true"
here I am sharing my card view layout :
<?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"
android:layout_width="280dp"
android:layout_height="match_parent"
android:gravity="bottom"
android:orientation="vertical">
<androidx.cardview.widget.CardView
android:id="#+id/cvRegisteredPharmacy"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginBottom="30dp"
app:cardBackgroundColor="#color/colorAccent"
app:cardUseCompatPadding="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:orientation="vertical">
<ImageView
android:id="#+id/ivPharmacy"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_weight="0.25"
android:background="#color/colorWhite" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="15dp">
<TextView
android:id="#+id/tvPharmacyName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="Pharmacy Name"
android:textColor="#color/colorWhite"
android:textSize="16sp"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RatingBar
android:id="#+id/rbPharmacyRating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:numStars="5"
style="?android:attr/ratingBarStyleSmall"
android:rating="3.5"
android:progressTint="#color/colorPrimary"
android:progressBackgroundTint="#color/colorGrey" />
<TextView
android:id="#+id/tvPharmacyInfo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:text="3.5"
android:textColor="#color/colorWhite"
android:textSize="12sp" />
</LinearLayout>
<TextView
android:id="#+id/tvPharmacyAddress"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="Pharmacy Address, 1/2 Main St NW, Monteral, QC"
android:textColor="#color/colorWhite"
android:textSize="14sp" />
</LinearLayout>
<Button
android:id="#+id/btnSelectPharmacy"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginBottom="15dp"
android:background="#drawable/btn_bg_white"
android:text="Select Pharmacy"
android:textColor="#color/colorAccent"
android:visibility="gone" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
Here is the complete layout that I've made
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activities.PharmacyMapActivity">
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rvPharmaciesList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
Also, I am sharing the simple code where I am setting visibility of this button :
if (holder.btnSelectPharmacy.getVisibility() == View.VISIBLE){
holder.btnSelectPharmacy.setVisibility(View.GONE);
} else {
holder.btnSelectPharmacy.setVisibility(View.VISIBLE);
}
I've tried many solutions so far including view animation, Object animator, Expandable layout (through library) but no luck so far!
looking forward for your suggestions.
I've a workaround for this to lift the card up but then I want to make my card expanded from upside exactly as like as in the above picture.
While using automatic layout animation on the child node, the result will be, that the parent node just snaps to layout_alignParentBottom & wrap_content once the child node is View.GONE.
Combining two animations could make it less jerky. I mean, the CardView would need it's height animated; either synchronously or once the child node is View.GONE. Actually, when animating the child node to height 0dp, this would also animate the parent node's height, since it's wrap_content; setting a static value for the height would also prevent it from snapping alike that. Also animating to View.INVISBLE and then animating it's height would prevent the parent node from snapping. Sorry for not providing a ready-made solution, but explaining why it behaves alike that and how it might work is still better than no answer.

ANDROID STUDIO- layout background (image) doesn't show

everyone, first of all, I'm with a problem in my android project. I set an image as a layout background with the appropriate width (5.5), and when I run the application it appears white background instead of the intended image. The image is in at the drawable folder, all normal.
The image has the same dimensions of the layout (5.5)
Code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:animateLayoutChanges="true"
android:background="#drawable/fundo"
android:orientation="vertical"
tools:context=".MainActivity">
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="300dp"
android:layout_marginTop="200dp"
app:srcCompat="#drawable/logo_branco" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="450dp"
android:fontFamily="#font/advent_pro_thin"
android:text="O automóvel ideal para si!"
android:textColor="#E76C00"
android:textSize="20sp"
android:textStyle="bold" />
</RelativeLayout>
If you want to load a whole image, I'd use the approach of having an ImageView at the root ViewGroup of the layout with both dimensions set to match_parent.
This will solve the issue of the image not loading with an added benefit of being able to define scale type (like centerCrop) which enables you to have a picture with any side ratio and be sure it'll fill the screen both vertically and horizontally.
Edit:
Proposed solution:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:animateLayoutChanges="true"
tools:context=".MainActivity">
<ImageView
android:id="#+id/background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/fundo" />
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="300dp"
android:layout_marginTop="200dp"
app:srcCompat="#drawable/logo_branco" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="450dp"
android:fontFamily="#font/advent_pro_thin"
android:text="O automóvel ideal para si!"
android:textColor="#E76C00"
android:textSize="20sp"
android:textStyle="bold" />
</RelativeLayout>

Is there a way to check overview button?

I am developing an app where there is a left Drawer on the Home screen. The drawer fits perfectly on most devices, but on some devices, the drawer is covered whether the screen has overview button(phone without physical button, using on screen button) or its swallowed under the bottom of the screen(mostly happen on Xiaomi, and yes, i've tried on 5 xiaomi phones).This also happening on the emulator from android studio. The Question is, can the app knows if there a overview button on the phone , so the app can be developed to put the layout on top(not covering) of it. Or is there another way, more simple and efficient?
Here is the layout code:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/drawer_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
</LinearLayout>
<!-- *********** NAVIGATION DRAWER *********** -->
<LinearLayout
android:id="#+id/left_drawer"
android:layout_width="#dimen/drawer_width"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:background="#color/drawerColor"
android:fitsSystemWindows="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:paddingLeft="#dimen/drawer_user_padding_left"
android:paddingBottom="#dimen/drawer_user_padding_bottom"
android:paddingTop="#dimen/drawer_user_padding_top_newest"
android:orientation="vertical" >
<TextView
android:id="#+id/referal_ID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/nav_fontsize"
android:textColor="#color/orange"
android:textStyle="bold"
android:text="\nReferal ID: " />
<TextView
android:id="#+id/profile_no"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/content_fontsize"
android:textColor="#color/orange"
android:textStyle="bold"
android:text="000" />
</LinearLayout>
<LinearLayout
android:id="#+id/userdata_wrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/theme"
android:paddingLeft="#dimen/drawer_user_padding_left"
android:paddingTop="#dimen/drawer_separator_margin_top"
android:paddingBottom="#dimen/drawer_user_padding_bottom"
android:orientation="vertical" >
<TextView
android:id="#+id/profile_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/content_fontsize"
android:textColor="#color/white"
android:textStyle="bold"
android:text="Name" />
<TextView
android:id="#+id/profile_email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/content_fontsize"
android:textColor="#color/white"
android:text="email#email.com" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/icon_point"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:adjustViewBounds="true"
android:background="#android:color/transparent"
android:src="#drawable/magno_coin"/>
<TextView
android:id="#+id/profile_credit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:textSize="#dimen/content_fontsize"
android:textColor="#color/white"
android:textStyle="bold"
android:text="0"/>
</LinearLayout>
</LinearLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ListView
android:id="#+id/upper_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/drawer_upper_nav_margin"
android:isScrollContainer="false"
android:scrollbars="none" >
</ListView>
<View
android:id="#+id/upper_separator"
android:layout_width="fill_parent"
android:layout_height="#dimen/drawer_separator_height"
android:layout_marginTop="#dimen/drawer_separator_margin_top"
android:layout_marginBottom="#dimen/drawer_separator_margin_bottom"
android:background="#color/contentColor"/>
<ListView
android:id="#+id/middle_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:isScrollContainer="false"
android:scrollbars="none">
</ListView>
<View
android:id="#+id/middle_separator"
android:layout_width="fill_parent"
android:layout_height="#dimen/drawer_separator_height"
android:layout_marginTop="#dimen/drawer_separator_margin_top"
android:layout_marginBottom="#dimen/drawer_separator_margin_bottom"
android:background="#color/contentColor"/>
<ListView
android:id="#+id/lower_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:isScrollContainer="false"
android:scrollbars="none">
</ListView>
<View
android:id="#+id/lower_separator"
android:layout_width="fill_parent"
android:layout_height="#dimen/drawer_separator_height"
android:layout_marginTop="#dimen/drawer_separator_margin_top"
android:layout_marginBottom="#dimen/drawer_separator_margin_bottom"
android:background="#color/contentColor"/>
<ListView
android:id="#+id/bottom_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:isScrollContainer="false"
android:layout_marginBottom="#dimen/item_margin"
android:scrollbars="none">
</ListView>
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="#dimen/drawer_separator_height"
android:background="#color/theme"/>
<TextView
android:id="#+id/current_version"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="bottom|right"
android:layout_alignParentBottom="true"
android:layout_marginTop="#dimen/item_space_margin"
android:layout_marginBottom="#dimen/item_space_margin"
android:layout_marginRight="#dimen/version_margin"
android:textSize="#dimen/smaller_fontsize"
android:textColor="#color/black"
android:text="ver 1.0.0"/>
</LinearLayout>
</LinearLayout></android.support.v4.widget.DrawerLayout>
On the picture i scrolled down until cant be scrolled anymore
Sorry, if I dont understand your question.
I dont see in your xml android.support.design.widget.NavigationView - its container for drawer content. You need to add implementation 'com.android.support:design:27.1.1' to your app dependencies to use NavigationView.
And if you want to do static header for your drawer, there is app:headerLayout="#layout/nav_header" property, where nav_header is your header layout.
For other items there are app:menu="#menu/drawer_view property, where drawer_view is your drawers menu. In this menu you can put as many items as you wish and they will be scrollable if needed. Also you can design it as you want and they are easy for handling in NavigationView.OnNavigationItemSelectedListener
See this Googles guide for more details. Hope it will help you.
This is a common problem. Place a listview (or more) inside a scrollview is not good. If you have a finite number of elements I suggest you to build your view programmatically (use addView).
However if you don't want to change your code read that: list view inside scrollview.
Basically you need to calculate the real height of the listview for every item (getMeasuredHeight) after notifyDataSetChanged. This should fix your problem.
To prevent overlapping by Bottom Soft NavigationBar add this to your styles.xml in a values-v21 dir (if dir not exist, create one and copy same styles.xml file from value):
<item name="android:windowDrawsSystemBarBackgrounds">false</item>
Like this eg -
<style name="Theme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:windowDrawsSystemBarBackgrounds">false</item>
.....
.....
</style>

Unable to scroll

Please have a look at the following android xml file which is responsible for creating GUI
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/imageTitle"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="14dp"
android:text="#string/imageDate"
android:textAppearance="?android:attr/textAppearanceLarge" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="254dp"
android:layout_weight="0.34"
android:src="#drawable/test_image" />
<TextView
android:id="#+id/textView3"
android:layout_width="fill_parent"
android:layout_height="136dp"
android:text="#string/imageDescription" />
</LinearLayout>
</ScrollView>
I am trying to scroll the whole screen, but it is not happening. The uploaded images will make it clear to you. Why it is not scrolling? I am new to android and this is my second app. Please help!
for using scroll view, if u have entire view to be scrollable, use scroll view as parent layout and use code like this.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true">
here android:fillViewport="true" this is important part which allows u to fill the entire screen for your layout. if any other issue ask .
As android.developer says for fillViewport Defines whether the scrollview should stretch its content to fill the viewport.
Change this 2 like this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/textView3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/imageDescription" />
I think you should use wrap_content in the LinearLayout

android: image in icon not showing

I'm trying to place a banner at the top of a listview, one that stays there when the list scrolls down. The layout I currently have actually show what I want in the preview but when I run it in the emulator the only thing that appears is the list.
The XML is:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView android:src="#drawable/edinburghcrest"
android:layout_height="wrap_content" android:layout_width="wrap_content"
android:id="#+id/EdUniCrest" android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"></ImageView>
<TextView android:layout_height="wrap_content" android:id="#+id/banner"
android:text="Hotels Nearby" android:textColor="#FFFFFF"
android:gravity="center" android:textSize="20dp" android:layout_width="wrap_content"
android:layout_alignParentTop="true" android:layout_toRightOf="#+id/EdUniCrest"
android:layout_alignParentRight="true" android:layout_alignBottom="#+id/EdUniCrest"
android:background="#25476C"></TextView>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:background="#color/listcolor" android:orientation="vertical" android:layout_marginTop="50dp">
<ListView android:id="#android:id/list" android:layout_width="wrap_content"
android:layout_height="wrap_content">
</ListView>
<TextView android:id="#android:id/empty" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="#string/no_lunchs" />
</LinearLayout>
Anyway, I can't see why it isn't working. Does anyone have any idea what it might be?
Thanks.
The RelativeLayout here just makes it confusing. You can achieve this simply with a couple of LinearLayouts. Wrap your banner in a horizontal layout with a height=wrap_content and set you ListView to height=fill_parent. The list will then fill all available space. The List will scroll independently of the rest of the page.
Something like below should work:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout android:orientation="horizontal" android:id="#+id/bannerBar"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView android:src="#drawable/edinburghcrest"
android:layout_height="wrap_content" android:layout_width="wrap_content"
android:id="#+id/EdUniCrest"/>
<TextView android:layout_height="wrap_content" android:id="#+id/banner"
android:text="Hotels Nearby" android:textColor="#FFFFFF"
android:gravity="center" android:textSize="20dp" android:layout_width="wrap_content"
android:background="#25476C"/>
</LinearLayout>
<ListView android:id="#android:id/list" android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
<TextView android:id="#android:id/empty" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:text="#string/no_lunchs" />
</LinearLayout>
What if you wrapped your RelativeLayout in a ScrollView, and since a ScrollView can only have one child, put the banner above it?

Categories