xml / linearlayout not showing properly on device - android

I'm sorry if this question's been asked already but I wasn't able to find any answers. Here's some background context:
I was testing my app on my Nexus 4 to fix some minor bugs. However, just as eclipse was launching it, there was a powercut in the area, switching my computer off. Eventually, once the power restored, I thought I would set a font by .setTypeFace() before running my app again but this made my app crash when I did run it. So after fiddling around with the code and finding no fix, I decided to get rid of the whole font and just run the app with the bug fix. However, this made my app look like this.
Now on eclipse, the graphical layout is showing this. My app before today was showing like the graphical layout perfectly fine. No errors are showing up on eclipse.
Why has this happened and how do I fix this? Could I have corrupted the whole file?
Thanks.
EDIT: the xml file:
<?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="#drawable/testbg"
android:orientation="vertical"
android:weightSum="100" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="33" >
---- bunch of textviews ----
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="57" >
---- More Textviews ----
</RelativeLayout>
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="10"
android:orientation="horizontal"
android:weightSum="3" >
---- three buttons ----
</LinearLayout>
</LinearLayout>

I finally figured it out - it was the background. I must've obviously messed up the 9.png somewhere because it fixed itself once I got rid of the background.

Normally this happens with my apps when i change the font , some fonts appears like this in the layouts , some play around i use is adding a character or a dot after tab space , and it works , however double check the font issue again ,try to set the font again or to set another font.

Related

Android Studio XML Widgets not rendering properly in designer

Recently, while working on some projects, I've had a rather annoying problem when coding the user interface of my application. The problem is, some controls (usually a floating action button or a regular button) render strangely. It's hard for me to explain exactly how it looks - but here's an example of how it shows the floating action button to look like in the designer:
Code:
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:baselineAligned="false"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
tools:context=".MainActivity">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:src="#drawable/ic_baseline_add_24"
android:layout_height="wrap_content"/>
</LinearLayout>
Now, the thing is, I don't have any weird or special code added, the XML code is as pure as it gets, so I have no idea why I am having these strange rendering problems.
Here is how it rendered the following button:
Code:
<com.google.android.material.button.MaterialButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Submit"
android:layout_gravity="bottom"
android:textAllCaps="false"
android:layout_margin="30dp"
app:cornerRadius="30dp"
android:id="#+id/submitButton"
android:backgroundTint="#color/turquoise"
/>
Image:
A solution would be greatly appreciated!
Cheers,
Tom
Solution is simple u just need to restart your android rendering engine. I provided Image for your context . In android studio top right corner above layout display there is Toggle issue panel click on that and u will see one box in the bottom showing rendering issue restart rendering engine and that will restart your android studio. and u good to go. try this solution and let me know your issue is solved or not.
note: In my Image I already restarted so there is no option for restart rendering engine .but in yours's U may be find hope so.
Image

Using bluejamesbond DocumentView

I'm trying to use the bluejamesbond DocumentView to display a bit of justified text. I'm unable to get text to display even in the simplest of cases;
<com.bluejamesbond.text.DocumentView xmlns:ext="http://schemas.android.com/apk/res-auto"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
ext:documentView_text="test"
android:background="#android:color/background_light" />
I've tried both a light and a dark background in case the default colour is one of them and hence invisible.
I've obtained the library by adding the following to the module's build.gradle;
compile 'com.github.bluejamesbond:textjustify-android:2.1.1'
The only indication of any problem is a fidelity warning from the Android Studio preview, but running on the real device (4.4.2) gives the same lack of text in each case.
I'd initially tried the more complicated example, removing the progress bar and changing the text to just some simple inline text to get rid of other dependencies. That didn't work either, again with different backgrounds.
To rule out the possibility of something else in the layout affecting it, I've also created a new layout as follows. Again, with either a light or dark background the expected text "test" is not to be seen.
<?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">
<com.bluejamesbond.text.DocumentView xmlns:ext="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
ext:documentView_text="test"
android:background="#android:color/background_dark" />
</LinearLayout>
There is a (working) demo of the library on Play Store which gives an indication that this library is of decent quality and well maintained, so how can I move on from here?

Android text gets clipped on some devices

I am facing an issue in one phone (till yet). My app uses Hindi fonts. It shows well on emulator, tab, many other phones too. But one of the phone which I am using for testing purpose is showing the text going cut from sides.
I tried almost everything for putting it in the right order but none worked. Here posting the screenshots of two of my test phones and the text.
The screenshot with error:
The screenshot of other phones: and the expected one too:
What could be the reason and how can I solve it? Please let me know!!
TextView configs I am using:
<TextView
android:id="#+id/A_lbl_mandir"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/Abt_mandir"
android:textAlignment="center"
android:textColor="#80000A"
android:textSize="35sp" />
EDIT: My complete activity xml:
<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"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<TextView
android:layout_width="wrap_content"
android:id="#+id/text"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="#string/hello_world" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/text" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:padding="5sp"
android:text="#string/test"/>
</ScrollView>
</RelativeLayout>
I have tried and deleted many other things especially for this phone. But unable to solve the issue!
this occurs in 4.1.2 and its documented as a bug in Google which they have fixed in 4.2.
https://code.google.com/p/android/issues/detail?id=34432
This happens with unicode fonts where the Android OS is not able to calculate the length of the text.
try this.
<ScrollView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_below="#id/text"
android:padding="5dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:gravity="left"
android:padding="5sp"
android:text="#string/test"/>
</ScrollView>
All right! Found another phone with same issue. In that phone too, the text was clipped. I guess there is some problem with the phone. Because even popular apps like Whatsapp has got the same problem on that device. The Hindi text was cut same as shown in the images above.
Possible fix for that issue: (if someone gets that n what I am doing now.) I realised that browser shows the hindi fonts well on that. So better make a native app on html, javascript especially for such devices and view the HTML using WebView.The application will get a little slow but we have to do it Until we get the actual problem creating it.
Please note: this is not a solution, but a fix to make that work. Better known as "JUGAAD" in hindi.
On some phones (specially on Samsung ones) some custom fonts are cuted off (or clipped). I had this with custom italic font. Some say that you can edit font to add some kind of padding (i can't confirm that because my lack of knowledge of editing fonts) but:
- EditText/TextView add some padding from xml
- Ellipsize (on some devices messing with this helps displaying text correctly)
Also could you post screenshot with enabled developer options to draw layout bounds, this could help to resolve your problem if above solutions won't help

Android nested layout

I am developing my first Android app. Although I have 15 years of Java software development experience, Android is new to me. My desired look is a background image with other images on top of it, as well as labels and phone numbers. It seems like the best way to accomplish this is a Linear Layout for the background image, with a nested layout for the other fields on top of that. I have searched online and cannot find any sample code on how to accomplish this. Any recommendations would be greatly appreciated. Thanks in advance.
What are you using to develop? If you are you using Eclipse with the Android SDK this is super easy. Put the desired picture in the appropriate drawable folder, go to the graphical view of layout that corresponds to your activity, on the right side of the screen there is a list of all the properties, find background, then select your picture from drawables. You can also do this from the xml using android:background="#drawable/yourPic". This way you don't have to worry about having things layered on top of it.
I think you should go through followings:
1. http://phandroid.com/2011/05/11/10-tips-for-android-ui-design/
2. http://mobile.tutsplus.com/series/android-user-interface-design/
3. http://coding.smashingmagazine.com/2011/06/30/designing-for-android/
4. http://android-developers.blogspot.in/2011/09/thinking-like-web-designer.html
If I got, something like this can work:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<stuff>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<stuff>
</RelativeLayout>
<stuff>
</RelativeLayout>
I used it in an app, and made the trick.
First of all, RelativeLayout is the best layout to use. It depends on your design.
If your design says to keep all the views either vertically OR horizontally, you can use LinearLayouts in between.
My suggested way:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="wrap_parent"
android:orientation="Horizontal">
<View1 />
<View2 />
</LinearLayout>
</LinearLayout android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="wrap_parent"
android:orientation="Vertical"
android:layout_below="#id/layout1">
<View3 />
<View4 />
</LinearLayout>
</RelativeLayout>
Which will yield you something like this

Layout displayed in Emulator is not same as in real device

I am trying to display a text box using textView.I am adding some data in it during runtime. I just want it to display a box of size 23 lines.
Code am using is this.
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:id="#+id/twittertext"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fadingEdge="vertical"
android:maxLines="23"
android:minLines="23"
android:background="#drawable/dropshadow"
android:scrollbars="vertical"
android:text="Getting data on your slow n/w..."
android:textColor="#ffffff"
/>
</ScrollView>
</LinearLayout>
Now when i see this in emulator it's coming perfectly (Android 2.2) but when i test the same code in a real device (Wildfire 2.2.1) the box is not coming for 23 lines. Rather it just show a 5 line box. Am able to scroll but looks like the
:minLine
is not working.
Please help me.
Ok. I dont have a answer for it. But this is how i solved, just in case someone else want it.
I have used the screen pixels and then calculated the pixels i need for the view. Then added the same as
android:layout_height
property and it worked for me.

Categories

Resources