I am trying to make a Menu that contains 13 MenuItemImages in two columns (the last one is in the middle).
The frame width/ design resolution width is 480 pixels. MenuItemImage width is 180 pixels.
here is my code :
CCMenu* testMenu = CCMenu::createWithArray(testMenuItems);
testMenu->alignItemsInColumns(2,2,2,2,2,2,1);
CCSize size1 = CCDirector::sharedDirector()->getWinSize();
testMenu->setPosition(ccp(size1.width / 2, size1.height/2));
but the two columns are slightly overlapping. (the right one is above the left one)
here is the result of my code:
I would like it to be properly spaced with some padding between the two columns.
Please help me out I am new to Cocos2d-x.
the alignItemsInColumns will align menu itens based on itens center, against menu width.
In your case, you have 2 options:
1) Increase your menu width (by default, their size will be based on screen size. Change the menu.contentSize.width)
2) Change the anchor point of left itens to ccp(.7,.5) and right itens to ccp(.3,.5) for example
Related
I have created a GUI with the aid of Tkinter that has created a 3 [C]olomn by 8 [R]ow, (I have placed the borders of the 'cells' in red) and output is like so:
Just to calrify:
Where the "logo [E]" is (C1,R1) & (C1,R2) are rowspanned and where the "main window" is from (C2,R3) to (C3,R8) are colomnspanned and rowspanned.
All are Label widget except for (C1,R3 to C1,R8), which are button widgets with a command to display a string in "Main Window" (gray area).
My aim is to make the "Main Window"(gray area) display only in different grid layouts based on the selected button on the left. So for example I would like to make the grey have a grid layout of 2col by 4 row when C1,R6 is pressed, or when C1,R3 is pressed the grid layout to be 2Cx6R all in the gray area.
Q: Is there a way of re-gridding a label? If so how? Or an alternative approach?
ADDENDUM:
Ideally I would like to update the GREEN area with different number of row and column configurations. For example: When Micro Audit is touched, the Green area will configure itself to have 4 rows by 2 columns, and when Find Item is selected, it will only 3 rows with 1 column, etc. :
I'm trying to align some controls in my wxPython app to bottom of a panel. Here's sample of my code:
def __DoLayout(self):
vsizer = wx.BoxSizer(wx.VERTICAL)
hsizer = wx.BoxSizer(wx.HORIZONTAL)
hsizer2 = wx.BoxSizer(wx.HORIZONTAL)
hsizer.Add(self.prog, 0, wx.ALL|wx.EXPAND, 5)
hsizer2.Add(self.text, 0, wx.ALL|wx.EXPAND, 5)
#hsizer.Add(self.timer, 0, wx.EXPAND|wx.ALIGN_RIGHT)
vsizer.Add(hsizer2, 0, wx.EXPAND)
vsizer.Add(hsizer, 0, wx.ALIGN_BOTTOM|wx.EXPAND)
self.SetSizer(vsizer)
I would like the bottom horizontal sizer (hsizer) to stretch to bottom, or the top one to stretch placing bottom sizer on the bottom (that would actually be better).
[EDIT: Proposed sulution description]
The proportion parameter defines the ratio of how will the widgets change in the defined orientation. Let's assume we have three buttons with the proportions 0, 1, and 2. They are added into a horizontal wx.BoxSizer. Button with proportion 0 will not change at all. Button with proportion 2 will change twice more than the one with proportion 1 in the horizontal dimension.
From zetcode
Solution proposed by Renae Lider
With reluctance, but as #renae-lider who answered the question has not posted an answer.
Change the 0 to 1 in this line :
vsizer.Add(hsizer2, 1, wx.EXPAND)
This is the proportion parameter.
The proportion parameter defines the ratio of how will the widgets change in the defined orientation.
Let's assume we have three buttons with the proportions 0, 1, and 2. They are added into a horizontal wx.BoxSizer. Button with proportion 0 will not change at all. Button with proportion 2 will change twice more than the one with proportion 1 in the horizontal dimension.
I'm using GetTextExtentPoint32W to get width of a text in a cell in MS Excel 2010. The cell width is fetched using ActiveCell.Width. These two widths are then compared to determine whether the text fits in the cell or extends out of the cell.
Visually, even though the text fits perfectly in the cell, the text width returned by the method is more than the cell width. Also, when I increase the font size the difference between actual text width and that returned by the method increases.
Following is a part of the source code used to achieve the result. Please help me solve this error.
hDC = ctypes.windll.user32.GetDC(self.windowHandle)
tempBMP = ctypes.windll.gdi32.CreateCompatibleBitmap(hDC, 1, 1)
hBMP = ctypes.windll.gdi32.SelectObject(hDC, tempBMP)
iFontSize = self.excelCellObject.Font.Size
deviceCaps = ctypes.windll.gdi32.GetDeviceCaps(hDC, 90)
iFontSize = int(iFontSize)
iFontSize = ctypes.c_int(iFontSize)
iFontSize = ctypes.windll.kernel32.MulDiv(iFontSize, deviceCaps, 72)
iFontSize = iFontSize * -1
iFontWeight = 700 if self.excelCellObject.Font.Bold else 400
sFontName = self.excelCellObject.Font.Name
sFontItalic = self.excelCellObject.Font.Italic
sFontUnderline = True if self.excelCellObject.Font.Underline else False
sFontStrikeThrough = self.excelCellObject.Font.Strikethrough
#Create a font object with the correct size, weight and style
hFont = ctypes.windll.gdi32.CreateFontW(iFontSize,
0, 0, 0,
iFontWeight,
sFontItalic,
sFontUnderline,
sFontStrikeThrough,
False, False, False,
False, False,
sFontName)
#Load the font into the device context, storing the original font object
hOldFont = ctypes.windll.gdi32.SelectObject(hDC, hFont)
sText = self.excelCellObject.Text
log.io("\nText \t"+sText+"\n")
textLength = len(sText)
class structText(ctypes.Structure):
_fields_ = [("width", ctypes.c_int),
("height",ctypes.c_int)]
StructText = structText()
getTextExtentPoint = ctypes.windll.gdi32.GetTextExtentPoint32W
getTextExtentPoint.argtypes = [ctypes.c_void_p,
ctypes.c_char_p,
ctypes.c_int,
ctypes.POINTER(structText)]
getTextExtentPoint.restype = ctypes.c_int
#Get the text dimensions
a = ctypes.windll.gdi32.GetTextExtentPoint32W(hDC,
sText,
textLength,
ctypes.byref(StructText))
#Delete the font object we created
a = ctypes.windll.gdi32.DeleteObject(hFont)
a = ctypes.windll.gdi32.DeleteObject(tempBMP)
#Release the device context
a = ctypes.windll.user32.ReleaseDC(self.windowHandle, hDC)
textWidth = StructText.width
cellWidth = self.excelCellObject.Width
Thanks.
I do not use Python or Excel 2010 so cannot comment on your current approach. However, I have struggled with a similar problem. I hope the following points will be helpful.
Background
If you hover over the right boundary of an Excel column and hold the left mouse button you will get a display of the format: “Width: n.nn (mm pixels)”.
The help for the ColumnWidth property says:
One unit of column width is equal to the width of one character in the
Normal style. For proportional fonts, the width of the character 0
(zero) is used.
Use the Width property to return the width of a column in points.
As far as I can tell, “Normal style” means the standard font name and size at the time the workbook was created. Changing the standard font name and size for an existing workbook does not appear to have any effect. Changing the font name and size for a worksheet has no effect.
Two example displays for a standard width column are:
For Arial 10 Width: 8.43 (64 pixels)
For Tahoma 10.5 Width: 8.38 (72 pixels)
I have created a string of zeros and attempted to measure how many are visible depending on the width of the column. I found the number of zeroes that I could see matched the value displayed reasonably well for such as subjective measure.
With VBA, the ColumnWidth property of a column or cell sets or returns the width in characters.
With VBA, The read only Width property of a column or cell returns .75 * the width in pixels.
The significance of the above information is that the width values obtained from Excel are not necessarily correct for the font being used.
My problem and the solution I discovered
The problem I had was that I was merging cells and filling them with text. Although Excel will adjust the height of a row so the text within an unmerged cell is visible, it will not do so for a merged cell. I tried many techniques including Microsoft’s .Net, text rendering routines without success. Nothing I tried would reliably emulate Excel’s system for determining the width of text.
The technique I eventually used successfully involved picking a cell to the right and below all used cells for experimental use. I adjusted the width of the experimental cell’s column to match the combined width of the merged cell and copied the formatted value from the cell whose height I wanted. Because the experimental cell was unmerged, Excel would adjust the height as appropriate. I then made sure the source row was at least this height.
The key feature of this technique was that I was not trying to emulate Excel’s system for determining the width of text; I was using Excel’s system.
You would need to try different column widths for the experimental cell. I would start with the current width of the source column. If the row height matches that for a single row, the width of the source column is already sufficient. If the row height is more than that for a single row, I would increase the column width until the row height matched that for a single row and then adjust the source column’s width to match. If you start with the widest value (in characters or Python’s text width) you will probably get the source column width correct at the first attempt which would avoid the need for later adjustments.
I don't know how to move ".buttons-box" to bottom of ".blog-item". I can set {position: relative;} for ".blog-item" and {position: absolute; bottom :0; right:0} for ".buttons-box", but it does not solve my problem, because change me width for ".buttons-box" and I need his width exactly as has ".content-box" and then I can't set width to 100%, because take width from relative parent, what is in this case "blog-item". I can't set specific width in pixels for "div.buttons-box" because is dynamic as ".content-box" and ".text". They have width according to image and this image can have different size in every single "blog-item".
What i need:
moved div ".buttons-box" to bottom of ".blog-item"
".buttons-box" must have same width as ".content.box"
".buttons-box" must be under ".text" and must have placeholder for
self, because if text will be too long, and if he had position
abolute will be over text
Thank you!
Image Sample: ttp://i.stack.imgur.com/6WfUm.jpg
JSFIDDLE Sample and Demonstration: http://jsfiddle.net/yjdEk/
Edit:
My idea on JSFIDDLE: http://jsfiddle.net/RhShT/
I created placeholder "buttons-box-placeholder" for buttons-box
I set position relative for ".content-box" and postion absolute for
".buttons-box"
I need now some script for set width and height, but only from his parrents not global, becouse every single .blog-item can be different:
.buttons-box width = .content-box width
.content-box heigh = .blog-item height
There is a CSS width property value called "inherit" which should make child's width equal to parent's.
I am using the setViewBox() function in Raphael 2. The width and height is multiplied by a value like (1.2, 1.3 ...). This changes the magnification/ zooming properly but the x and y which I have given as 0,0 makes the paper display its contents after some offset. If i modify the x and y to some positive value after the rendering( using firebug!!) then the top left of the paper moves back and above to its right position. I want to know how will the value be calculated. I have no idea about how the x,y affect the viewbox. If anybody can give me any pointers for this it will be a real help.
I have tried giving the difference between the width/ height divided by 2. Also I must mention that I am not rendering an image but various raphael shapes e.g. rects, paths text etc. in my paper.
Looking forward to some help!
Kavita
this is an example showing how to calculate the setViewBox values, I included jquery (to get my SVG cocntainer X and Y : $("#"+map_name).offset().left and $("#"+map_name).offset().top) and after that I calculated how much zoom I need :
var original_width = 777;
var original_height = 667;
var zoom_width = map_width*100/original_width/100;
var zoom_height = map_height*100/original_height/100;
if(zoom_width<=zoom_height)
zoom = zoom_width;
else
zoom = zoom_height;
rsr.setViewBox($("#"+map_name).offset().left, $("#"+map_name).offset().top, (map_width/zoom), (map_height/zoom));
did you put the center of your scaling to 0,0 like:
element.scale(1.2,1.2,0,0);
this can scale your element without moving the coordinates of the top left corner.