Tuesday, March 16, 2010

Limelight Notes: Styling

Basic notes I am gathering on Limelight GUI framework. These are just notes that are useful to me for the research I am doing. I am throwing them up on my blog because others may find this useful as well....This is also an experiment in using MacJournal as a new note taking tool.

Prop Layout

You can layout props based on fixed size (e.g. 30 in pixel) or on a relative size ( ’90%’ of parent). If the current prop will run past 100% width then it puts that props on a new row and a y position with is one more than the tallest prop in the preview row. Two examples...

This shows that the orange and green box are laid out at a y of the tallest previous prop (blue):

root :width => 500, :height => 500 do
box :width => '50%', :height => '10%', :background_color => :red
box :width => '50%', :height => '50%', :background_color => :blue
box :width => '50%', :height => '50%', :background_color => :orange
box :width => '50%', :height => '50%', :background_color => :green
end

PastedGraphic.aNLScNOn2gLf.jpg

If we modify this example a little bit:

root :width => 500, :height => 500 do
box :width => '50%', :height => '10%', :background_color => :red
box :width => '51%', :height => '50%', :background_color => :blue
box :width => '50%', :height => '50%', :background_color => :orange
box :width => '50%', :height => '50%', :background_color => :green
end

PastedGraphic1.8s6Ex8ksxKiv.jpg

We can see that the red and blue box are laid out on separate rows now since the width of the blue box would have exceeded 100% if it was put onto the first row. This example shows another important aspect of layout. prop layout is first come first serve. The first two props fully fit the requested width and height, but the second two seem to run off the bottom.

Style Resolution

Style resolution most important to least: inline, prop name, left to right styles attribute values in that order.

Example:

props.rb:
box :width => 100, :height => 100, :styles => "big_box, heh", :background_color => :blue, :border_width => 5, :border_color => :black

styles.rb:
box {
border_color :red
}

big_box {
border_color :orange
}

heh {
border_color :blue
}

With all three, then we notice that the color is black. If I remove the inline element then we see that ‘box’ one. And ‘big_box’ comes in third if we comment out box. ‘heh’ comes in last.

A second aspect to style resolution is that any style which has overlapping behavior ends up wiping out the other style. So for example, if in the example above I add ‘left_border_width 1’, then the inline styling wipes this out with ‘:border_width => 5’. If we swap these two values so that left_border_width is the inline style then we will just see the left border and the border_width value will be wiped out. This is a very simple rule, but perhaps not what is expected in cases because

Styles in Limelight have no inheritance unlike CSS. Setting border_width of 1 on a parent will not cascade that rule to its children. If you really want to share behavior you can use extends:

fill_parent {
width '100%'
height '100%'
}

box {
extends :fill_parent
background_color :orange
}

I find this to be pretty powerful, but I would like to find a way to add methods which allow me to reduce text:

def percent_dims(w, h)
width w.to_s + ‘%’
height h.to_s + ‘%’
end

fill_parent {
percent_dims 100, 100
}

I know there is a way to extend style system, so I need to look into that...

56 comments:

  1. Thanks Tom for posting this. Your notes look to be accurate. I think these type of simple examples are really helpful for newcomers to Limelight.

    ReplyDelete
  2. Hi,
    I have Ruby on rails app with me.Now I want to integrate my app with JRuby in order to get the asynchronous feature.How do I proceed?
    Any help would be greatly appreciated,thank you very much.

    ReplyDelete
  3. Thank you for showing us how we can style our limelight notes. Honestly, I was really in such a need to understand that as I am a writer for dissertation writing UK based and there are much important stuff that I have to note down and by knowing such way of styling I can set priorities on them as well. I just can’t wait now to try this.

    ReplyDelete
  4. I think you want css expert for more creative and stylish designing. visit my page for more ideas : www.exporthub.com/auto-transportation

    ReplyDelete
  5. Thank you so much for ding the impressive job here, everyone will surely like your post. 바카라사이트

    ReplyDelete
  6. I have never seen this type of information before. Thanks for sharing this. Please also visit 카지노사이트

    ReplyDelete
  7. 스포츠토토 Iwas more than happy to find this site. I want
    to to thank you ffor your time for this particularly
    wonderful read!! I definitely savored every little bit of it and i also have yyou saved
    aas a favorite to check out new stuff in your website.

    ReplyDelete
  8. 토토 It's awesome designed for me to have a web site, which is helpful designed for my knowledge. thanks admin

    ReplyDelete

  9. You're so interesting! I don't suppose I've read anything like this before.
    So great to find someone with a few unique thoughts on this issue.
    Seriously.. many thanks for starting this up. This site is something that is needed on
    the internet, someone with some originality! 청마담

    ReplyDelete
  10. Great post I would like to thank you for the effort you put into writing this interesting and informative article, no matter what is the purpose of your trip to Turkey, you need to pay the visa cost Turkey before submitting the visa application .Depending on your desired option, the e Visa Turkey cost are calculated.

    ReplyDelete
  11. Superb information article. Thank you . The travelers need to fill up the Kenya visa application form to get the Kenya visa. Therefor, if the apply evisa kenya online online, will get the fastest visa services with 24 hours customer support.

    ReplyDelete
  12. I just got to this amazing site not long ago was actually captured with the piece of resources you have got here and big thumbs up for making such wonderful blog page!
    Data Scientist Course

    ReplyDelete
  13. I get your meaning, saved in my bookmarks, a very decent website.. India visa for us citizens, US citizens are eligible to apply for the India eVisa. The process is completely online and there is no need to submit the paperwork in person to any Indian Embassy or Consulate.

    ReplyDelete
  14. Thanks for sharing this information. Keep it up.... South Africa visa, The Government of South Africa has confirmed that South Africa's new e-Visa system will be implemented for 15 countries by March 2022.

    ReplyDelete
  15. What an outstanding post! “I'll be back” (to read more of your content). Thanks…. Foriegn travelers whose sole purpose of visiting India is for leisure, sightseeing, religious work or casual travel to visit their friends or relatives can apply for Indian tourist visa through online India visa application system.

    ReplyDelete
  16. I wanted to say Appreciate providing these details, you're doing a great job with the site... 파칭코사이트인포

    ReplyDelete
  17. Hi, I think that I saw you visited my weblog thus I came to “return the favor". I am trying to find things to improve my website! I suppose its ok to use some of your ideas!!

    야동
    휴게텔
    횟수 무제한 출장
    스포츠마사지

    ReplyDelete
  18. Nice Many Thanks for sharing this awesome content you provide to all your reader's. Really appreciate it. 야한동영상

    Please visit once. I leave my blog address below
    야설
    야한동영상

    ReplyDelete
  19. I found this is an informative blog and also very useful and knowledgeable. Thank you for posting such a great article! I found your website perfect for my needs. It contains wonderful and helpful posts. Keep up the good work!. Thank you for this wonderful Article! 일본야동

    Please visit once. I leave my blog address below
    한국야동
    일본야동

    ReplyDelete
  20. Just as powerful, just as strong, and just as well funded. I was very interested in the article. it’s quite inspiring I should admit. I like visiting you site since I always come across interesting articles like this one. 한국야동닷컴

    Please visit once. I leave my blog address below
    국산야동
    한국야동닷컴

    ReplyDelete
  21. Thank you for sharing excellent information. Your web-site is so cool. I am impressed by the details that you've on this blog. 국산야동

    Please visit once. I leave my blog address below
    야설
    국산야동

    ReplyDelete
  22. Thanks for this post!! it was great reading this article!! i would like to know more!! keep in touch and stay connected!! Cheers! 중국야동넷

    Please visit once. I leave my blog address below
    야설
    중국야동넷

    ReplyDelete
  23. Nice Post thank you very much for sharing such a useful information and will definitely saved and revisit your site and i have bookmarked to check out new things frm your post.
    Data Science Course

    ReplyDelete
  24. Well done for this excellent article. and really enjoyed reading this article today it might be one of the best articles I have read so far and please keep this work of the same quality.
    Data Analytics Course in Noida

    ReplyDelete
  25. Excellent work done by you once again here and this is just the reason why I’ve always liked your work with amazing writing skills and you display them in every article. Keep it going!
    Data Analytics Courses in Hyderabad

    ReplyDelete
  26. Hello there! This post could not be written any
    better! Reading through this post reminds me of my previous roommate!
    He constantly kept talking about this. I am going to send
    this post to him. Pretty sure he'll have a very good read.
    Many thanks for sharing! 토토사이트


    ReplyDelete
  27. It looks like I have been to this site before, but after reading some of the post I realized it is new to me. Regardless, I'm glad I found it and I will be returning soon. Apply for Indian visa application via online evisa India website.

    ReplyDelete

  28. Hi there! I thought I've been to this site before, but upon reading some of the content I realized it's brand new to me. Nonetheless, I'm definitely glad I found it and I'll be bookmarking and checking back often Apply for Indian visa application via the online evisa India website.

    ReplyDelete
  29. Very interesting blog and lot of the blogs we see these days don't provide anything that interests me but i am really interested in this one just thought I would post and let you know.
    Data Science Training Institute in Noida

    ReplyDelete
  30. I like to view your web site which is very useful and excellent resource and truly adored reading your posting. Thank you!
    Data Science Course in Gurgaon

    ReplyDelete
  31. Very informative Blog! There is so much information here that can help thank you for sharing.
    Data Analytics Course in Bangalore

    ReplyDelete
  32. I am hoping the same best effort from you in the future as well and in fact your creative writing skills has inspired me.
    Data Science Course near me

    ReplyDelete
  33. This is really nice which is really cool blog and you have really helped a lot of people who visit the blog and give them useful information.
    Data Science Training in Noida

    ReplyDelete
  34. Nice post. This is a great article and am pretty much pleased with your good work. Very helpful information. Thank you.
    Best Data Science Courses

    ReplyDelete
  35. I am always searching online for articles that can help me and you made some good points in Features also. Keep working, great job
    Data Science Training

    ReplyDelete
  36. Very informative Blog! There is so much information here that can help thank you for sharing.
    Data Analytics Training in Bangalore

    ReplyDelete
  37. Really this article is truly one of the best in article history and am a collector of old "items" and sometimes read new items if i find them interesting which is one that I found quite fascinating and should be part of my collection. Very good work!
    Data Scientist Course in Gurgaon

    ReplyDelete
  38. I really enjoyed reading this post and keep up the good work and let me know when you can post more articles or where I can find out more on the topic.
    Data Science Online Course

    ReplyDelete
  39. I would like to say that this blog really convinced me to do it and thanks for informative post and bookmarked to check out new things of your post…
    Data Science Institute in Noida

    ReplyDelete
  40. Wow, fantastic blog layout! How long have
    you been blogging for? you made blogging look easy.
    The overall look of your website is excellent, as well as the content! 바카라사이트


    ReplyDelete
  41. Interesting post. which i wondered about this issue so thanks for posting and very good article which is a really very nice and useful article. Thank you
    Data Science Course in Noida

    ReplyDelete
  42. Tamiloneindia is one of the best news websites and is a must for fans of Fox’s television reporting. The site set-up is straightforward, and links to Fox’s shows are also provided. You will also be able to access breaking stories and topics like entertainment, business, lifestyle, and more. Tamil One India's extensive network of reporters will be able to provide you with a one-stop shop for all your news needs.

    ReplyDelete
  43. The user interface is very important for any product to make it win in the niche.
    When we talk about the user interface, we think about the graphical user interface. We can refer interface as a layout. It should be according to the user's requirement and convincing enough to make you stand out.
    Just like, we need a good user interface in gaming, we need a professional layout for the dissertation proposal. Dissertation Proposal writing is the initial and important stage for a master's or doctoral degree. As your degree depends on the dissertation, it is the proposal to prove it and should be professional and convincing. Don't worry, we are here with a solution. We are offering best dissertation proposal writing services for the student to make them confident for their final research thesis.

    ReplyDelete
  44. The blog was actually fantastic! Lots of abundant advice and inspiration, both of which we all need! 토토사이트

    ReplyDelete
  45. Great blog, thank you so much for sharing with us. 경마사이트

    ReplyDelete
  46. Thanks for sharing this amazing article, it is very informative post good work keep it up. 릴게임

    ReplyDelete
  47. Fantastic web site. Lots of helpful info here 스포츠토토

    ReplyDelete
  48. Daebak! that’s what I was looking for, what a information! present here at this website
    바카라사이트비즈

    ReplyDelete

  49. Excellent effort to make this blog more wonderful and informative. The information shared was very useful.
    Data Analytics Course in Chandigarh

    ReplyDelete
  50. I am actually happy to read this website posts which contains plenty of helpful information, thanks for providing these kinds of statistics. 바카라사이트

    ReplyDelete
  51. Good morning everybody.. Your article is more useful for all the people. Thank you sir.. Many people query What is Indian visa service fee? Visa fee depends on your nationality and your visa duration. You can read all other information about the Indian e-visa on our India eVisa page. We have explained all requirement on our page....

    ReplyDelete
  52. Hello everyone, Foreign citizens can enter India for business purposes. Indian government allows foreign country citizens they can can be apply for e business visa for India. e Business Visa India, Non-Indian visitors who are looking for business business or meetings, setting up industrial or business enterprises in India or other similar business activities etc.

    ReplyDelete
  53. Loved the inspirational article thanks. Citizens of the United States of America need a visa to travel to India. Yes, India visa for US citizens, US citizens can apply online for an Indian visa. Indian visa for US citizens is issued for under the following 5 categories:- You can choose your category then apply for your visa.

    ReplyDelete
  54. I read your website material. It's so amazing and really enhances knowledge.I just inform you, We provide ecommerce web development company services. We aim at making e-commerce solutions technically impeccable and catchy to let your company stand out in the eCommerce market. If you have any query related to eCommerce development solutions then visit our website you will get complete information related to your query.

    ReplyDelete
  55. I read your blog and found many interesting metrics in this material. Thanks for sharing it on the Internet. Person who is willing to visit Turkey can apply for a Turkish e visa which is a totally online process. Fill the application form, make payment & receive it in email. As simple as that.

    ReplyDelete
  56. Wow you have nice content on your page. Your audience will enjoy it while they are read. Turkey visitors can apply e visa of Turkey online from anywhere in the world. The process is easy and convenient which saves your time & money.

    ReplyDelete