why the bad font resolution with EditText? - android

I am using the default EditText control in my app and the font and resolution looks very poor, especially in comparison to whatever DbTextViewer or the Internet/Chrome browser is using, which looks much cleaner.
The app is intended to run on larger-screen device like tablets, and not so much phones.
How do you improve the appearance of the text here?
Here is my app
DbTextEditViewer looks much nicer
main.xml
<EditText
android:id="#+id/edtx"
android:inputType="textFilter|textMultiLine"
android:textSize="10sp" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="0dp"
android:paddingBottom="0dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:orientation="horizontal" >
<Button
android:id="#+id/button2"
android:paddingBottom="8dp"
android:layout_width="wrap_content"
android:layout_height="26sp"
android:textSize="8sp"
android:text="save"/>
</LinearLayout>
</LinearLayout>

I found the answer to my question indirectly at
https://stackoverflow.com/a/6922397/266457
http://developer.android.com/guide/practices/screens_support.html

Related

Android notification custom view layout is different on another device

I've created a notification out of custom view.
The problem is that it looks fine on a Nexus 5X device but it looks broken on Samsung Galaxy S4 device.
My notification contains Hebrew content, so it needs to be with a right-to-left direction (meaning buttons are on the left and text is on the right).
This is what the notification looks like on the Nexus 5X device (just like I meant it to look):
This is what the notification looks like on the Samsung Galaxy S4 device:
As you can see, the notification on the Galaxy S4 is differently (the buttons on the right, the text indentation is off and so on)
I have to say that most of the app looks fine on both of the devices.
This is the only thing that set the two apart.
In addition, both of the devices are set to the same language and locale.
This is the code of the layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1"
android:layout_marginTop="-4dip"
android:layoutDirection="locale">
<Button
style="?android:attr/buttonStyleSmall"
android:layout_width="59dp"
android:text="סבבה"
android:layout_height="227dp"
android:id="#+id/attendButton"
android:layout_marginLeft="-5dip"
android:layout_marginTop="-72dip" />
<Button
style="?android:attr/buttonStyleSmall"
android:layout_width="59dp"
android:text="לא טוב"
android:layout_height="245dp"
android:id="#+id/declineButton"
android:layout_marginLeft="-7dip"
android:layout_marginTop="-80dip" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Event Name"
android:tag="event"
android:id="#+id/eventName"
android:textColor="#android:color/black"
android:textSize="21sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/textView"
android:layout_weight="1"
android:visibility="invisible"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="EventTime"
android:id="#+id/eventTimeTxt"
android:textColor="#000000"
android:gravity="right"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="EventDayOfWeek"
android:id="#+id/eventDayOfTheWeekTxt"
android:textColor="#000000"/>
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="yesFromInvited"
android:textColor="#000000"
android:id="#+id/yesFromInvitedTxt"/>
</LinearLayout>
</LinearLayout>
I'm thinking that the location of the text and the buttons in the notification might have something to do with the fact that the content is in Hebrew (Right-to-Left language).
I have tried it on two different Galaxsy S4 devices, both of them have Android 5.0.1, and it looks the same in both of them. All of the devices are the same language and locale.
What can I do in order to fix this issue?
I won't refer to the fact that your design not following the design recommendation for Notification (as you can read here).
What I will say is that, regarding the fact that you declared that your content will be Hebrew, you just didn't design your xml attributes properly. You should use:
android:layoutDirection="rtl"
And also make sure to add android:supportsRtl="true" in the Application tag in the manifest.
And your buttons need to be inserted at the end of the root LinearLayout, not in the start.
Your xml should be something like that:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/eventName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:tag="event"
android:text="שם האירוע"
android:textColor="#android:color/black"
android:textSize="21sp"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="TextView"
android:visibility="invisible"/>
<TextView
android:id="#+id/eventTimeTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:text="EventTime"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#000000"/>
<TextView
android:id="#+id/eventDayOfTheWeekTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="EventDayOfWeek"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#000000"/>
</LinearLayout>
<TextView
android:id="#+id/yesFromInvitedTxt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="yesFromInvited"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#000000"/>
</LinearLayout>
<Button
android:id="#+id/attendButton"
style="?android:attr/buttonStyleSmall"
android:layout_width="59dp"
android:layout_height="227dp"
android:layout_marginLeft="-5dip"
android:layout_marginTop="-72dip"
android:text="סבבה"/>
<Button
android:id="#+id/declineButton"
style="?android:attr/buttonStyleSmall"
android:layout_width="59dp"
android:layout_height="245dp"
android:layout_marginLeft="-7dip"
android:layout_marginTop="-80dip"
android:text="לא טוב"/>
In your samsung device RTL is getting applied, its possible because samsung customize android framework.
Here I think you should disable RTL by setting android:layoutDirection="ltr" property in XML.
First, open the Galaxy S4's Developer Options page from the Android Settings menu and check "Force RTL layout direction". Check if the notification changes in any way - if it does, it means that the device does not correctly recognize the layout as being RTL in the first place.
Alternatively, you will need to check whether your device actually supports RTL locales. Keep in mind that a locale is not just <language>_<country>, but also has the notion of scripts, variants and extensions. Easiest way to check this:
Configuration config = getResources().getConfiguration();
if(config.getLayoutDirection() == View.LAYOUT_DIRECTION_RTL) {
//in Right To Left layout
}
Apart from that, when you create layouts that are meant to work with RTL locales, avoid using android:gravity="right" or android:gravity="left". Use end and start instead.

why the design of user interface change in different emulator in android studio?

I'm begin to learning android programming and I did not know much about this language
I write a program. I do not know why when I see my user interface it is good but when I run it with different emulators , each emulator show it in different way
enter code here : <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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin" tools:context="com.example.faezeh.homework2.MainActivity"
android:orientation="vertical"
>
<TextView android:text="تمرین دوم"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:textSize="50sp"
android:textColor="#ff4400"
android:paddingTop="30dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="مدیریت یادداشت"
android:layout_gravity="center_horizontal"
android:textSize="40sp"
android:textColor="#000000"
android:paddingTop="30dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="تاریخ : 1393/12/26"
android:layout_gravity="center_horizontal"
android:textSize="40sp"
android:textColor="#000000"
android:paddingTop="30dp"
/>
<Button
android:id="#+id/theList"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="فهرست یادداشت ها"
android:textSize="30sp"
android:textColor="#000000"
android:background="#00ffff"
android:layout_gravity="center_horizontal"
android:layout_marginTop="30dp"
/>
<Button
android:id="#+id/search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="جستجوی یادداشت "
android:textSize="30sp"
android:textColor="#000000"
android:background="#00ffff"
android:layout_marginTop="10dp"
android:layout_gravity="center_horizontal"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:gravity="bottom"
>
<Button
android:id="#+id/aboutUs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="درباره ما"
android:textSize="35sp"
android:textColor="#000000"
android:background="#00ffff"
android:layout_gravity="left|bottom"
/>
<Button
android:id="#+id/setting"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="تنظیمات"
android:textSize="35sp"
android:textColor="#000000"
android:background="#00ffff"
android:layout_gravity="right|bottom"
/>
</LinearLayout>
try to see this thing in your eclipse then your user interface will never change.
you can convert Activity check at here is schreen size 15 schreen sizes are given here to check all android device follow these size once
Since android is available for various types of devices, here I am saying the screen size of the device. So every device comes under certain category with their corresponding screen size, these category are probably LDPI, MDPI, HDPI, XHDPI and XXHDPI. So the design we do usually varies among different screen size.
For detail information regarding the multiple screen size in android and how to handle it, do visit:
http://developer.android.com/guide/practices/screens_support.html
what i have to do to fix this? for example nexus one and nexus 5 show
my program in different way . what i have to do to both of them show
it in right way? – faezeh 1 hour ago
Well for this case you have to particularly design your screens in such a way that it optimize all the screen size. For this here are some key design parameters you should look on:
use textAppearnce instead of textSize property like :
android:textAppearance="?android:attr/textAppearanceLarge"
Try to hard code your controls specially buttons, as dp automatically resize according to the screen size of device.
Try to use layout_weight property in your design.
If you follow this basic guideline, then there will be no problem.
Cheers

Stop ScrollView collapsing when using keyboard and allow scrolling of elements behind?

I know there are a few questions about this on SO but I haven't found one to solve my exact issue, nor have I been able to figure it out from other answers.
I have a layout with a few EditText boxes, and the bottom of which is fairly big and stretches from about halfway down the page to the bottom. When I activate the keyboard, this EditText is then shrunk to reach just above where the keyboard stops. This isn't an issue on devices with larger screens, but on some of the older devices I can see that the box is barely visible.
Is there a way that I can wrap my layout into a ScrollView to allow the box to stay the same size, and let the user just scroll the page to see any items hidden by the keyboard (i.e. making the area above the keyboard the "window" but keeping the same sized views inside)?
A good example of what I mean is in the HTC's Mail setup screen where when creating a new account, you can scroll the screen to see the content hidden behind the keyboard when it's active. There are probably others, but that came to mind.
Here is the XML for my page, as you can see it's quite simple (my Strings are placeholders, so nobody point that out :P).
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:text="Contact Us"
android:textAppearance="?android:attr/textAppearanceLarge" />
<View
android:layout_width="fill_parent"
android:layout_height="2dp"
android:layout_alignLeft="#+id/title"
android:layout_alignRight="#+id/title"
android:layout_below="#+id/title"
android:background="#000000" />
<TextView
android:id="#+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/title"
android:layout_marginLeft="20dp"
android:layout_marginTop="6dp"
android:text="Your Email:"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/editTextFrom"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_alignLeft="#+id/email"
android:layout_below="#+id/email"
android:layout_marginRight="20dp"
android:layout_marginTop="6dp"
android:background="#drawable/bordered"
android:ems="10"
android:inputType="textPersonName"
android:paddingLeft="3dp"
android:paddingRight="3dp" >
<requestFocus />
</EditText>
<TextView
android:id="#+id/subject"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/editTextFrom"
android:layout_below="#+id/editTextFrom"
android:layout_marginTop="6dp"
android:text="Your Subject:"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/editTextSubject"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_alignLeft="#+id/subject"
android:layout_below="#+id/subject"
android:layout_marginRight="20dp"
android:layout_marginTop="6dp"
android:background="#drawable/bordered"
android:ems="10"
android:inputType="textCapSentences"
android:paddingLeft="3dp"
android:paddingRight="3dp" >
<requestFocus />
</EditText>
<TextView
android:id="#+id/message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/editTextSubject"
android:layout_marginLeft="20dp"
android:layout_marginTop="6dp"
android:text="Your Message:"
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/editTextMessage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignLeft="#+id/message"
android:layout_below="#+id/message"
android:layout_marginRight="20dp"
android:layout_marginTop="6dp"
android:layout_marginBottom="10dp"
android:layout_alignParentBottom="true"
android:background="#drawable/bordered"
android:ems="10"
android:gravity="top|left"
android:imeOptions="actionDone"
android:inputType="textCapSentences"
android:paddingLeft="3dp"
android:paddingRight="3dp" />
I know there are a few edits to the AndroidManifest.xml which can be made, and I'm pretty sure this is doable, I just can't seem to find the right combo!
Any help is appreciated, if I didn't make it clear enough just say.
This is far beyond what I had in mind originally, so I'm not going to accept this unless nothing better comes up.
What I'm doing now to solve the issue is I added android:windowSoftInputMode="adjustResize" to my activity in the AndroidManifest.xml.
I tested a bunch of screen sizes and figured that 800px height was roughly the limit for when it gets a bit difficult to read due to the keyboard, so I added the following code to my onCreateView():
DisplayMetrics screen = new DisplayMetrics();
getActivity().getWindowManager().getDefaultDisplay().getMetrics(screen);
if(screen.heightPixels < 800){
getActivity().getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_PAN);
}
It'd make sense to work out roughly which setting is likely to have more devices (>= 800 or < 800 and flip the if statement accordingly, just to make it more efficient (although it won't be noticeable).
As I said this is a workaround rather than an ideal answer to the question, so more answers please! :)
Edit: Didn't account for density, now using if(screen.displayDPI < 160 && screen.heightPixels < 800){

Android App GUI

Recently I've been working on my first android app that converts to and from different units of temperatures. I have all the actual coding down pat, but I'm having an issue creating a GUI for it. I've been using the DroidDraw UI builder to generate the xml code; Inside of DroidDraw I'm using RelativeLayout throughout the entire UI. Whenver I create it in DroidDraw it looks fine in the preview, but when I try to run the app, it always ends up looking like basically a jumbled mess:
Does this have anything to due with requirements for different screen sizes, and if so, how can I fix it?
Adding some extra information, I'm not running it through an emulator; I'm running it on my captivate which has a 480x800 screen. Also, I'm building using the NetBeans IDE with the NBAndroid Plugin.
Here's my [main.xml][2] file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="#+id/widget32"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<EditText
android:id="#+id/input"
android:layout_width="100px"
android:layout_height="wrap_content"
android:textSize="18sp"
android:layout_alignTop="#+id/output"
android:layout_alignParentLeft="true"
>
</EditText>
<TextView
android:id="#+id/widget42"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Output"
android:layout_below="#+id/ftok"
android:layout_alignLeft="#+id/ktoc"
>
</TextView>
<TextView
android:id="#+id/widget41"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Input"
android:layout_below="#+id/ftok"
android:layout_alignParentLeft="true"
>
</TextView>
<Button
android:id="#+id/ftok"
android:layout_width="104px"
android:layout_height="wrap_content"
android:text="Far To Kel"
android:textStyle="bold"
android:layout_alignTop="#+id/ctok"
android:layout_alignParentLeft="true"
>
</Button>
<Button
android:id="#+id/ctok"
android:layout_width="104px"
android:layout_height="wrap_content"
android:text="Cel To Kel"
android:textStyle="bold"
android:layout_alignTop="#+id/ktoc"
android:layout_alignLeft="#+id/ctof"
>
</Button>
<Button
android:id="#+id/ktoc"
android:layout_width="104px"
android:layout_height="wrap_content"
android:text="Kel To Cel"
android:textStyle="bold"
android:layout_below="#+id/ctof"
android:layout_alignParentRight="true"
>
</Button>
<Button
android:id="#+id/ctof"
android:layout_width="104px"
android:layout_height="wrap_content"
android:text="Cel To Far"
android:textStyle="bold"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
>
</Button>
<Button
android:id="#+id/ktof"
android:layout_width="104px"
android:layout_height="wrap_content"
android:text="Kel To Far"
android:textStyle="bold"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
>
</Button>
<Button
android:id="#+id/ftoc"
android:layout_width="104px"
android:layout_height="wrap_content"
android:text="Far To Cel"
android:textStyle="bold"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
>
</Button>
<TextView
android:id="#+id/widget50"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Temperature Conversion is Fun!"
android:textSize="16sp"
android:textStyle="bold"
android:layout_below="#+id/widget49"
android:layout_toRightOf="#+id/widget41"
>
</TextView>
<TextView
android:id="#+id/widget49"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Kel=Kelvin"
android:layout_below="#+id/widget48"
android:layout_alignLeft="#+id/ctok"
>
</TextView>
<TextView
android:id="#+id/widget48"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cel=Celcius"
android:layout_below="#+id/widget47"
android:layout_alignLeft="#+id/ctok"
>
</TextView>
<TextView
android:id="#+id/widget47"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Far=Fahrenheit"
android:layout_below="#+id/input"
android:layout_alignLeft="#+id/ctok"
>
</TextView>
<EditText
android:id="#+id/output"
android:layout_width="100px"
android:layout_height="wrap_content"
android:textSize="18sp"
android:layout_below="#+id/widget42"
android:layout_toRightOf="#+id/ctok"
>
</EditText>
</RelativeLayout>
Any help would be much appreciated.
I never used droiddraw for real world layouts before and just downloaded it to test a bit around.
And from what I see: I would not recommend using it.
All the generated layouts use px by default as a unit to specify view sizes. That is a very bad idea in terms of android layouts (due to the many screen sizes/densities around) and should almost never be neccessary (I have yet to find a layout where that's useful). And even worse, I can't specify any other unit in the properties tab.
That leads to the exact problems you are seeing. Layouts which look correct on the screen size they were designed for and horribly failing on every other screen.
I recommend writing XML by hand. Or if you rather use a WYSIWYG editor, use the eclipse ADT plugin, that editor improved a lot recently.
Since the Dalvik Virtual Machine is heavily based on the Java Virtual Machine and I'm a Java Programmer, I can offer a little advice. If the droid API has an equivalent to JPanel, organize stuff with Panels (it looked like you may do that already). Also, check to see if the frame has a "refresh()" type of function - Usually that helps to tell the window to organize stuff accordingly.

why i can't see all phrases i wrote in the textView?

i create a linear with 2 TextView like this :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:background="#drawable/popup_message"
android:orientation="vertical">
<TextView android:text="#string/atten"
android:id="#+id/title"
android:textColor="#color/white"
android:textSize="15sp"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="30px"
android:paddingTop="15dp"></TextView>
<TextView android:text="#string/msg"
android:id="#+id/msg"
android:textColor="#color/littleBlack"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingRight="10dp"
android:textScaleX="1"
android:paddingLeft="25dp"
android:paddingTop="10dp"></TextView>
when i include this on other pages sometime i see the full text sometime no . any idea ? ps : forgive my english
I see, you're messing a lot with the measurements of your views. The best way is to always use sp or dip to measure your view. px can be used only if your targeting a specific device. Try resolving this problem and maybe you'll find the answer.

Categories

Resources