making own theme

Put problem concerning Views, Layouts and other XML-Resources (like AndroidManifest) here.

Postby pskink » Mon Jan 12, 2009 10:54 am

darolla wrote:about checkboxes: I think we need a <selector> with <item>. but what are the xml attributes for checked and unchecked and focused and disabled and ... ? is there an android.dtd oder android xsd? or how do you get the names of the attributes?

about tabhost: I pack all graphics I've found inside the SDK. maybe you can use them or search inside the sources?

greetings,
marco


marco, take a look into btn_check.xml. this file is in sdk/tools/lib/res/default/drawable, it defines all the states of checkbox, look also into themes.xml and styles.xml, thes are in values folder
pskink
pskink
Master Developer
Master Developer
 
Posts: 719
Joined: Mon Nov 24, 2008 3:49 pm

Top

Postby darolla » Mon Jan 12, 2009 10:58 am

yes, I am busy with it :)
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany

Postby pskink » Mon Jan 12, 2009 11:13 am

darolla wrote:yes, I am busy with it :)


as i said, checkboxes should be easy cake, but when it comes to tabhosts/tabwidgets i'm completely lost...
pskink
pskink
Master Developer
Master Developer
 
Posts: 719
Joined: Mon Nov 24, 2008 3:49 pm

Postby darolla » Mon Jan 12, 2009 11:18 am

well, I did this:

1) styles.xml
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2.     <style name="Widget.CheckBox">
  3.  
  4.         <item name="android:background">@drawable/btn_check_default</item>
  5.  
  6.         <item name="android:clickable">true</item>        
  7.  
  8.     </style>
  9.  
  10.  
Parsed in 0.001 seconds, using GeSHi 1.0.8.4


2) themes.xml
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2.     <item name="android:checkboxStyle">@style/Widget.CheckBox</item>
  3.  
  4.  
Parsed in 0.000 seconds, using GeSHi 1.0.8.4


3) btn_check_default.xml (note: android:state_checked)
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2. <?xml version="1.0" encoding="utf-8"?>
  3.  
  4. <selector xmlns:android="http://schemas.android.com/apk/res/android">
  5.  
  6.     <item android:state_checked="true" android:drawable="@drawable/btn_check_on" />
  7.  
  8.     <item android:state_enabled="true" android:drawable="@drawable/btn_check_off" />
  9.  
  10. </selector>
  11.  
  12.  
Parsed in 0.001 seconds, using GeSHi 1.0.8.4


4) main.xml
exchanged cancel button for checkbox

it seems to work, but I've the problem with the stretched graphic.

trying to rename it to ...9.png won't work, because there are no help lines.

btw: I took the original btn_check_off_longpress.png and btn_check_on_longpress.png and renamed them...

can u help me on the stretching problem, please?

greetings,
darolla
Attachments
Theme DaRolla.zip
(81.79 KiB) Downloaded 339 times
Last edited by darolla on Mon Jan 12, 2009 12:50 pm, edited 1 time in total.
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany

Postby pskink » Mon Jan 12, 2009 11:51 am

darolla wrote:well, I did this:

1) styles.xml
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.     <style name="Widget.CheckBox">
  2.         <item name="android:background">@drawable/btn_check_default</item>
  3.         <item name="android:clickable">true</item>        
  4.     </style>
  5.  
Parsed in 0.001 seconds, using GeSHi 1.0.8.4




try to use 'background' and 'button' items (just like in original android's styles.xml stylename=widget.compoundbutton.checkbox)
pskink
pskink
Master Developer
Master Developer
 
Posts: 719
Joined: Mon Nov 24, 2008 3:49 pm

Postby darolla » Mon Jan 12, 2009 12:49 pm

alrite, I did it like in the sdk originals...

a peace of cake, like you said :)

I placed just a simple android icon above all checkboxes to show that I changed the original graphic, cauz I am not that good with photoshop :?

Greetings,
DaRolla

PS: I try to help you with the tabbed...
Attachments
Theme DaRolla.zip
(156.19 KiB) Downloaded 226 times
Theme DaRolla.png
Theme DaRolla.png (12.76 KiB) Viewed 6288 times
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany

Top

Postby pskink » Mon Jan 12, 2009 1:00 pm

darolla wrote:alrite, I did it like in the sdk originals...

a peace of cake, like you said :)


PS: I try to help you with the tabbed...



thanks, tabs are the real challenge ;)

btw you could also add state 'focused/selected' to indicate checkbox is selected.
pskink
pskink
Master Developer
Master Developer
 
Posts: 719
Joined: Mon Nov 24, 2008 3:49 pm

Postby darolla » Mon Jan 12, 2009 1:45 pm

I just build a basis for us.

It's a xml based tabview.

Maybe this helps the find the right xml pieces to manipulate ;)

Read you soon,
DaRolla

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.  
  2. package tut.orial;
  3.  
  4.  
  5.  
  6. import android.app.TabActivity;
  7.  
  8. import android.os.Bundle;
  9.  
  10. import android.widget.TabHost;
  11.  
  12. import android.widget.TabHost.TabSpec;
  13.  
  14.  
  15.  
  16. public class Tab extends TabActivity {
  17.  
  18.  
  19.  
  20.         @Override
  21.  
  22.         public void onCreate(Bundle savedInstanceState) {
  23.  
  24.                 super.onCreate(savedInstanceState);
  25.  
  26.  
  27.  
  28.                 setContentView(R.layout.tab);
  29.  
  30.  
  31.  
  32.                 final TabHost tabHost = getTabHost();
  33.  
  34.  
  35.  
  36.                 TabSpec ts1 = tabHost.newTabSpec("Page1");
  37.  
  38.                 ts1.setIndicator("Dummy1", null);
  39.  
  40.                 ts1.setContent(R.id.contentDummy1);
  41.  
  42.  
  43.  
  44.                 tabHost.addTab(ts1);
  45.  
  46.  
  47.  
  48.                 TabSpec ts2 = tabHost.newTabSpec("Page2");
  49.  
  50.                 ts2.setIndicator("Dummy2", null);
  51.  
  52.                 ts2.setContent(R.id.contentDummy2);
  53.  
  54.                 tabHost.addTab(ts2);
  55.  
  56.         }
  57.  
  58. }
  59.  
  60.  
Parsed in 0.035 seconds, using GeSHi 1.0.8.4


Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2. <?xml version="1.0" encoding="utf-8"?>
  3.  
  4. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  5.  
  6.         android:orientation="vertical" android:layout_width="fill_parent"
  7.  
  8.         android:layout_height="fill_parent">
  9.  
  10.  
  11.  
  12.         <TabHost android:id="@android:id/tabhost" android:layout_width="fill_parent"
  13.  
  14.                 android:layout_height="fill_parent">
  15.  
  16.  
  17.  
  18.                 <TabWidget android:id="@android:id/tabs"
  19.  
  20.                         android:layout_width="wrap_content" android:layout_height="wrap_content" />
  21.  
  22.  
  23.  
  24.                 <FrameLayout android:id="@android:id/tabcontent"
  25.  
  26.                         android:layout_width="fill_parent" android:layout_height="fill_parent"
  27.  
  28.                         android:paddingTop="80px">
  29.  
  30.  
  31.  
  32.                         <LinearLayout android:id="@+id/contentDummy1"
  33.  
  34.                                 android:orientation="vertical" android:layout_width="fill_parent"
  35.  
  36.                                 android:layout_height="fill_parent">
  37.  
  38.                                 <TextView android:textSize="16px" android:layout_width="fill_parent"
  39.  
  40.                                         android:layout_height="wrap_content" android:text="...Dummy1..."
  41.  
  42.                                         android:padding="10px" android:textColor="#000000"
  43.  
  44.                                         android:background="#ffc700" />
  45.  
  46.                         </LinearLayout>
  47.  
  48.  
  49.  
  50.                         <LinearLayout android:id="@+id/contentDummy2"
  51.  
  52.                                 android:orientation="vertical" android:layout_width="fill_parent"
  53.  
  54.                                 android:layout_height="fill_parent">
  55.  
  56.  
  57.  
  58.                                 <TextView android:textSize="16px" android:layout_width="fill_parent"
  59.  
  60.                                         android:layout_height="wrap_content" android:text="...Dummy2..."
  61.  
  62.                                         android:padding="10px" android:textColor="#000000"
  63.  
  64.                                         android:background="#aac700" />
  65.  
  66.                         </LinearLayout>
  67.  
  68.  
  69.  
  70.                 </FrameLayout>
  71.  
  72.  
  73.  
  74.         </TabHost>
  75.  
  76.  
  77.  
  78. </LinearLayout>
  79.  
  80.  
Parsed in 0.006 seconds, using GeSHi 1.0.8.4
Attachments
ThemeTab2.png
ThemeTab2.png (6.34 KiB) Viewed 6277 times
ThemeTab1.png
ThemeTab1.png (6.3 KiB) Viewed 6277 times
Theme Tab.zip
(22.92 KiB) Downloaded 186 times
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany

Postby pskink » Mon Jan 12, 2009 2:56 pm

the problem with tabwidget/tabhost is that i cannot figure out what <item>s in <style> to add.

i tend to think that images for those widgets are somehow 'hardcoded' and cannot be styleable.

if you find anything i'll appreciate it much
pskink
pskink
Master Developer
Master Developer
 
Posts: 719
Joined: Mon Nov 24, 2008 3:49 pm

Postby darolla » Mon Jan 12, 2009 3:11 pm

hi, I think I can help u a lot :)

I started with the graphics, because they should be referenced...
tab_focus.9.png, tab_press.9.png, tab_selected.9.png and tab_unselected.9.png are referenced in tab_indicator.xml, all files inside the folder drawable.

2) I started to search for all occurences of tab_indicator.xml and I found lots of files.
I put them all together.

Please check out this project and take a look.

Greetings,
DaRolla

PS: I didnt know how to use the tab_indicator.xml. so I did this inside styles.xml
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2. <!--  not the best trick <img src="http://www.anddev.org/images/smilies/sad.png" alt=":(" title="Sad" /> -->
  3.  
  4. <item name="android:background">@drawable/tab_indicator</item>
  5.  
  6.  
Parsed in 0.000 seconds, using GeSHi 1.0.8.4


this way the graphics are taken, but not shown the way I want to :(

maybe you can go on...
Attachments
screenshot.png
screenshot.png (6.7 KiB) Viewed 6268 times
Theme Tab.zip
(97.86 KiB) Downloaded 201 times
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany

Postby darolla » Mon Jan 12, 2009 3:13 pm

inside drawable folder there are the files tab_bottom_left.xml and tab_bottom_right.xml.

they use the small graphics.

I think they build this whole thing together out of very small parts...
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany

Postby pskink » Mon Jan 12, 2009 4:28 pm

darolla wrote:hi, I think I can help u a lot :)

Please check out this project and take a look.

Greetings,
DaRolla

PS: I didnt know how to use the tab_indicator.xml. so I did this inside styles.xml
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1. <!--  not the best trick :( -->
  2. <item name="android:background">@drawable/tab_indicator</item>
  3.  
Parsed in 0.000 seconds, using GeSHi 1.0.8.4


this way the graphics are taken, but not shown the way I want to :(

maybe you can go on...


thanks!

i'll run and let you know if i'm able to improve it.
pskink
pskink
Master Developer
Master Developer
 
Posts: 719
Joined: Mon Nov 24, 2008 3:49 pm

Postby darolla » Mon Jan 12, 2009 7:07 pm

I put checkboxes and radiobuttons into your theme.

the spinner's dialog now has the radiobuttons, too.

greetings,
darolla
Attachments
Theme DaRolla.zip
(329.41 KiB) Downloaded 214 times
Theme DaRolla.png
Theme DaRolla.png (12.6 KiB) Viewed 6253 times
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany

Postby pskink » Mon Jan 12, 2009 7:39 pm

darolla wrote:I put checkboxes and radiobuttons into your theme.

the spinner's dialog now has the radiobuttons, too.

greetings,
darolla


great!!

i'm still fighting with tabs project you uploaded but with no success... i took a look into TabWidget.java sources and it seems (lines 80 & 82) that images are really hardcoded.

i'll ask androId developers group if i'm right...
pskink
pskink
Master Developer
Master Developer
 
Posts: 719
Joined: Mon Nov 24, 2008 3:49 pm

Postby darolla » Sat Jan 17, 2009 4:25 pm

so what do the android devlopers say? ;)

I've got a question: do you know how to place a button like image behind every list item?

I wasn't successfull yet :cry:

Greetings,
DaRolla
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany

Top
PreviousNext

Return to View, Layout & Resource Problems

Who is online

Users browsing this forum: Google [Bot], Majestic-12 [Bot], Yahoo [Bot] and 8 guests