Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]

Table View Formating and navBar Text Size
Started by aroldopc Apr 18 2018 11:21 AM

5 replies to this topic
tableview widgets nav
This topic has been archived. This means that you cannot reply to this topic.
[TOPIC: post.html]


[GLOBAL: userInfoPane.html]
  • Enthusiast

  • 36 posts
  • Corona SDK

Hello Rob Miracle,


I made progress with my app and I need some advise on how to format it better.


As you can see on the image, The name of the country on the right side needs to have the same spacing before the Flag on the right side. I tried getting the length go the tex, but the character size varies. I also want to center the rows.

Also on the navBar widget, how do I change the Text Size on the navBar widget? I want to make for the Title bigger and bolder?

Attached Files

[TOPIC: post.html]


[GLOBAL: userInfoPane.html]
  • Corona Geek

  • 7,591 posts
  • Corona SDK

I know you wrote to Rob and he may write back, I wanted to suggest you set the anchorX property  on your text objects to either 0 or 1


If you set all the country name text object anchorX values to 0, they will all align on the left edge.


If you set all the country name text object anchorX values to 1, they will all align on the right edge.


So, for example the country names on the left could be set to 0


and the ones on the right could be set to 1.


This way they will align with the edges of their respective flags.


Is that what you're wanting?

Edited by roaminggamer, 18 April 2018 - 11:39 AM.

[TOPIC: post.html]


[GLOBAL: userInfoPane.html]
  • Enthusiast

  • 36 posts
  • Corona SDK



I tried your suggestion but it did not work.


I want to have equal distance between the objects in the row so I have:


Flag1 Country 1  Time  Country 2 Flag2. The trick here is to keep the Country2 name have the same space from the Flag2 on all rows. Flag1 and Country! they have the same space, but on Country2 I depend on the length of the country2 name to keep it let say 10 pixel from the Flag2, so they look uniform. The way it is in my image they vary. 


Here is my onRowRender function:

local function onRowRender( event )
   --Set up the localized variables to be passed via the event table
 --print ("onRowRender")
   local row = event.row
   local id = row.index
   local params = event.row.params
   local spx=5

   row.bg = display.newRect( 0, 0, display.contentWidth, 60 )
   row.bg.anchorX = 0
   row.bg.anchorY = 0
   row.bg:setFillColor( 1, 1, 1 )
   row:insert( row.bg )

   if ( event.row.params ) then    
      if ( row.isCategory )then --params.title then -- is category row
          row.title= display.newText( row,params.title, 12, 0, native.systemFontBold, 20 )
          row.title.anchorX = 0
          row.title.anchorY = 0
          row.title:setFillColor( 0 )
          row.title.x = 10
          row.title.y = row.height / 2   
          row.flag = display.newImageRect( row,params.flag,70, 46 ) 
          row.flag.x= 10
          row.flag.y = row.height *0.5-row.flag.height*0.5

          row.countryText = display.newText( row,params.country, 12, 0, native.systemFont, 18 )
          row.countryText.anchorX = 0
          row.countryText.anchorY = 1.0--0.5
          row.countryText:setFillColor( 0.5 )
          row.countryText.x = row.flag.x+row.flag.width+spx
          row.countryText.y = row.height / 2

          row.time = display.newText( row,params.time, 12, 0, native.systemFont, 18 )
          row.time.anchorX = 0
          row.time.anchorY = 1.0--0.5
          row.time:setFillColor( 0.5 )
          row.time.x = row.countryText.x *2.5
          row.time.y = row.height / 2

          row.flag2 = display.newImageRect( row,params.flag2,70, 46 ) 
          row.flag2.x= row.countryText.x *5
          row.flag2.y = row.height *0.5-row.flag.height*0.5

          local ln=string.len( params.country2 )-14
          row.countryText2 = display.newText( row,params.country2, 12, 0, native.systemFont, 18 )
          row.countryText2.anchorX = 1
          row.countryText2.anchorY = 1.0--0.5
          row.countryText2:setFillColor( 0.5 )
          row.countryText2.x = row.flag2.x- (10*ln)-150--(string.len( params.country2 )*10)-8
          row.countryText2.y = row.height / 2
          row.rightArrow = display.newImageRect(row,myApp.icons, 15 , 40, 40)
          row.rightArrow.x = display.contentWidth - 20
          row.rightArrow.y = row.height / 2
          row:insert( row.rightArrow )
          row:insert( row.countryText )
          row:insert( row.flag )
          row:insert( row.countryText2 )
          row:insert( row.flag2 )
   return true

[TOPIC: post.html]


[GLOBAL: userInfoPane.html]
  • Enthusiast

  • 36 posts
  • Corona SDK



First of all my apologies, you were right about using the anchorX values to 1, I used it on the Flag2, but when I used to the Country2 it did align correctly. That worked fine . Thank you.

[TOPIC: post.html]


[GLOBAL: userInfoPane.html]
  • Corona Geek

  • 7,591 posts
  • Corona SDK

Glad it worked!

[TOPIC: post.html]

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 26,196 posts
  • Enterprise

Thanks @roaminggamer.  While I appreciate the communities faith in me being able to respond to questions, our community is only great when others participate.


When you ask for me to specifically respond, you:


1. Limit the number of ideas that can help you solve the problem.

2. Delay your answer until I'm online and working next.


We have many other developers who can answer these project questions as well as, if not better than I can.


Again thanks @roaminggame, I do so ever appreciate your efforts.