Edit 4:
I solved it by creating a larger font, one that does fill the space. See solution posted below
Edit 3:
I have come to the conclusion that my problem as stated cannot be solved. The problem is that the fonts do not fill the image space because they are leaving room for descender like j and for umlauts above the capital letters. With further searching I find that negative padding, which is clearly what I need, is undefined so might do anything.
One solution would be to create custom fonts that fill the entire image space. Another is the suggestion below to use an imagebutton but my added complication of both needing a change in color on focus and a change in the basic image on program state complicates that solution to the point I can't figure that out.
Edit2: Added screen shot
Edit: Added code of drawable below.
I have tried every example I could find on stackoverflow and every answer from Google. I spent at least 3 hours last night before giving up. I sure could use some help on this if anyone knows the answer.
I have buttons on an Android app that is constrained in that the buttons can only be so big and the text in them needs to be readable in bright daylight so they need to be big. The solution is obvious, make the text a pixel smaller than the button. In other words, make the padding small. android:paddingTop="-10sp" does nothing. I have tried everything I could think of. To be clear, I want very little space between the top and bottom of the text inside a button and the edge of the button itself.
Here is an example of one of my buttons:
<Button
android:id="#+id/buttonSetTgt"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/textHeader"
android:layout_alignParentLeft="true"
android:background="#drawable/button_start"
android:textColor="#android:color/white"
android:onClick="onSetTgt"
android:paddingLeft="6sp"
android:paddingRight="6sp"
android:paddingTop="0sp"
android:paddingBottom="0sp"
android:text="◎"
android:textSize="#dimen/menu"
android:textStyle="bold" />
button_start has some colors and rounded corners definitions.
It is shown with padding top and bottom of zero but negative numbers don't do the trick so the 0sp or -10sp are equivalent.
Here is the code for the drawable:
<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" >
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#f07304"/>
<corners android:radius="7dp"/>
</shape>
</item>
<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#222222"/>
<corners android:radius="7dp"/>
</shape>
</item>
there is a nice facility provided...Imagebutton...
design the image(jpeg or png) as you want...place your text as you want any where in your image and simply set android:src="#drawable/yourimage
and here you go you will have the look as you want...
you can handle the ImageButton as normal button
try and implement this...
Try using margin instead of padding. Also, is your button background drawable wide enough to accommodate the text while preserving its proportions?
I found that you cannot specify negative padding so the solution was to make the fonts themselves larger, going almost all the way to where the padding starts. This means that t font needs to fill the area all the way to the top of the accent area and all the way down to the bottom of the descender area. What I did was found a program called Type 3.2 by CR8Software Solutions. You load your favorite font and copy one of the scaling actions to get a scale factor of about 1.56, make some adjustments to the baseline and font edges and save it. I probably could have gone a little bigger and actually gone above the top of the accent line. If I did it again, I would load a form character font to really see where the font space is. The trial version allows you to save up to about capital R so in my case where I just needed a few letters that was fine. Now I loaded the font into the "assets" folder and added code in the onCreate section of the code like this:
Typeface tf = Typeface.createFromAsset(this.getAssets(), "startline.ttf");
Button button = (Button) findViewById(R.id.buttonSync);
button.setTypeface(tf);
Button button2 = (Button) findViewById(R.id.buttonSetTgt);
button2.setTypeface(tf);
etc...
This allows me to change the size of the font and button without creating a new image and all the backgrounds and such work fine.
Related
I am developing an Android app. There's this issue with the EditTexts, because in some devices the "background" is white (which is the way I want it), but on others is transparent, and makes the app less professional. Here's an image with the "white background":
On other devices the edit texts that say "Yo" and "Casa" are transparent, so the words mix with the map and its pretty awful. I have tried changing the background color in the android layout xml. The closest one was I believe #drawable/white, but slightly changes the position and size of the edit text, making them look like they're one and its even worst.
Here is an example:
Is there a nice way to approach this problem? I read somewhere that an option was to add a white background image to the edit texts, but seemed like a lot of trouble.
UPDATE
I tried adding a background image, but its the same as changing the background color to any color using the android:background, the edit texts get like smaller or something. I added a blue "delimiter" to the image and this is the result:
But I want them like in the first picture, not so close one to another.
This would be the code of the edittext layout XML, the other one looks very similar. Only by adding the android:background tag changes from picture 1, to picture 3
SOLUTION
To solve this what I did was set a background image and set its height in dp as follows:
<EditText
android:id="#+id/markerTitle"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_alignParentLeft="true"
android:layout_below="#+id/buttonModifymarker"
android:ems="10"
android:inputType="textPersonName"
android:text="Título"
android:background="#drawable/editwhite"
>
Why don't you try setting the background of EditText programmatically?
yourEditText.setBackgroundColor(Color.WHITE);
or...
yourEditText.setBackgroundColor(Color.parseColor("#ffffff"));
simply you can add android:background="#drawable/white" attribute to your element in layout xml. you can use a lot of color resource between the double quotes (like from android color resources).
put the following image which has a solid white background in the drawable folder (it may dont appear because it's white and this page's background is white also) right click under this paragraph and select "Save Image as".
and refer to it in your layout and you will get a result like the following image
if the issue continue after trying this, please show me your layout code or email me at : mohamed_hamed4158#yahoo.com , thanks for voting my answer :)
Unfortunately I unable to understand the below design that's why asked like semi-oval footer.
Actually this is the footer design of a layout with two side buttons comes from one of the ios app. First I thought it like a bottom tab, but after some research i got to know that ,it is a footer with a FramaLayout, two buttons and one text to show the count, but still not sure what is this and how to do..
I added one footer in my layout and give it transparent-black background, but still unable to do this particular semi-oval style. suggestions and helps will be mostly appreciable.
Please suggest.
Thanks
I imagine your footer being a container: a LinearLayout (so that you can use weights) or a RelativeLayout.
Then it has a couple of clickable elements disposed horizontally (not giving details on this, assuming you can manage it by yourself)
Now, these two "clickables" (I'd use TextViews, so I can put the images and even text inside) have a semitransparent (50% black) background like these:
(rect_left)
and
(rect_rite)
To let the container background image see through.
I'm not so great at graphics, you will be able to make better pictures than mine. ;)
These ones just illustrate the concept.
You should create a new Drawable and use it as a background on a Relative/Linear Layout or View
Check this SO question and answer: Can I draw rectangle in XML?
As the question answer pair above gives an example of a rectangle you can modify it to be ovular:
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#666666"/>
<size
android:width="120dp"
android:height="120dp"/>
</shape>
I currently have icons in a GridView on my app. When they are clicked, an orange square appears around them briefly as a highlight. The only problem is that I think this looks amateurish and would like to change the shape so that it clips the icon in the GridView instead of a large square. If you are unsure as to what I mean, it is carried out successfully in the Catch Notes app, on their dashboard/home screen. I was just wondering whether anybody knew a way to tackle this or if it is simply a small layout attribute.
https://play.google.com/store/apps/details?id=com.threebanana.notes&hl=en
Thanks in advance, all help would be appreciated!
It looks effectively like this EditText in the image below. The way that it borders the EditText in orange is exactly how it borders the icons in the home screen when clicked.
First, in your layout file, specify a drawable background:
android:background="#drawable/bg_your_view"
Then edit the bg_your_view file which is in drawable:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/bg_your_view_pressed" android:state_pressed="true"></item>
<item android:drawable="#drawable/bg_your_view_normal" android:state_focused="false"></item>
</selector>
At last, create corresponding drawable files for pressed and normal states:
bg_your_view_pressed.xml contains the shape, the color you want for highlight.
bg_your_view_normal.xml is similar, just without highlight effect.
I've decided that the easiest way to solve this problem is to simply reference another image when the image on the GridView has been clicked. This means that the second image can just be edited in Photoshop in order to have a glow around it.
This question already has answers here:
Image does not show completely white despite it's correctly white
(6 answers)
Closed 7 years ago.
I have an ImageView in Layout. Layaout background is white (#android:color/white) and in ImageView contain a *.png picture. But white color on this picture is not the same white as in layout it is little gray.a http://desmond.imageshack.us/Himg513/scaled.php?server=513&filename=1325684647707.jpg&res=medium
I tried to change the format of the file, different color depth etc but it doesn't help. Then I remove minSdkVersion from manifest and it solve the problem. But I really need this tag in manifest. Does anybody have any idea which format of picture or what I have to change to fix it?
Thanks a lot
I have answered a similar quention: Image does not show completely white despite it's correctly white
Copied from there:
The cause of the problem is that regardless of the original bitmap format in the APK files all bitmaps are compressed (in my case into indexed 256-color! wtf?).
I couldn't find the way to prevent it, so if anyone knows the proper solution, please tell.
However, I found two solutions for the white color problem.
1) Per-bitmap: Say, we have a drawable bitmap resource called #drawable/mypng, which causes the problem. We need to add an additional XML drawable drawable/mypng_nofilter.xml
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/mypng"
android:filter="false"
/>
and use #drawable/mypng_nofilter instead.
2) For entire activity: In activity onCreate method we need to add
getWindow().setFormat(PixelFormat.RGB_565);
Now the window has 16-bit color depth and all bitmaps appear "properly" white.
Again, I would prefer to have 32-bit color depth, but I don't know how to control compile-time image compression.
instead of using default white color. redefine the white color in you xml and use the same
Create colors.xml under res-> value
<?xml version="1.0" encoding="utf-8"?>
<resources><color name="white">#ffffff</color> </resources>
Use this white color in you xml by #color/white" example android:background="#color/white"
I am using a shape defined as a drawable as background for a TextView. This allows me to add rounded corners and other other effects.
The shape is defined like this:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<corners android:topLeftRadius="8dp" />
</shape>
and I am using it like this:
<TextView
android:id="#+id/project"
style="#style/textView"
android:background="#drawable/project_textview_background"
/>
Now, I need to change the color of that TextView programmatically depending on some conditions. I have not been able to do that.
I tried to do setBackgroundColor but that seems to overwrite the background I previously defined so it doesn't show the rounded corners anymore.
I looked at a bunch of other API methods but got nowhere
Any help would be very much appreciated. Thank you
Any ideas?
the solution was actually to set the shape and color in code instead of using a drawable resource.
I used PaintDrawable(int color) which allows me to define whatever background color I want. Then I used the setCornerRadoii(float[]) to define the rounded corners and finally I assigned the PaintDrawable object to my textView background. Worked like a charme.
You could make other shapes that still has that corner attribute you already defined.
The way to fill the cell with bgcolor is written in next web page.(solid)
http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape
And if the conditions you mentioned depend on focus or press, you'd better to make selector instead of shape. Search with keyword "ColorStateList" in android reference. I want to leave the address, but I can't due to my reputation;;;