Cocos2d v3 CCButton with label using CCLabelBMFont - button

I am trying to create a CCButton named "Start" in cocos2d v3 using CCLableBMFont label as the button image. But I can't seem to get the label to be in the CCButton in v3.
Any help/advice would be appreciated.

I don't think you can apply a CCLableBMFont to a CCButton. Looking at the documentation, the only options available are:
+ (id)buttonWithTitle:(NSString *)title fontName:(NSString *)fontName fontSize:(float)size
or
+ (id)buttonWithTitle:(NSString *)title spriteFrame:(CCSpriteFrame *)spriteFrame
and a couple variations of these two. So I think you will have to settle with a sprite or a label with a TTF font as the button background.

Here's a utility function I added to my current project that does just that:
+(CCButton *)smallButtonWithLabel:(NSString *)button_label;
And the implementation:
+(CCButton *)smallButtonWithLabel:(NSString *)button_label
{
CCButton *button = [CCButton buttonWithTitle:nil spriteFrame:[CCSpriteFrame frameWithImageNamed:#"dlg-sml-btn-bg-s.png"] highlightedSpriteFrame:[CCSpriteFrame frameWithImageNamed:#"dlg-sml-btn-bg-t.png"] disabledSpriteFrame:[CCSpriteFrame frameWithImageNamed:#"dlg-sml-btn-bg-s.png"]];
[button setBackgroundOpacity:0.5 forState:CCControlStateDisabled];
CCLabelBMFont *label = [CCLabelBMFont labelWithString:button_label fntFile:SS_FONT_48_24_MULTI width:button.contentSize.width alignment:CCTextAlignmentCenter];
label.position = ccp(0.5, 0.5);
label.positionType = CCPositionTypeNormalized;
[button addChild:label];
return button;
}
You can modify it a little bit to fit your needs.
Hope this helps.

Related

Hovereffect with text on image not working

I'm a very basic coding person that needs something to work, but IDK how. I have a website where I have 4 images. When you hover over those img they become slightly darker, but I wish there was a way to show some text as well (preview of how it should work: https://imgur.com/a/r5cOW2R)
Here's the link to my GitHub code: https://github.com/Ezzol/HCI-Portfolio
Can anyone explain to me what I need to do to add that hovereffect you can see in my design at the imgur link?
You would want to use the CSS hover event. Here's a good example on how to do that.
https://www.w3schools.com/howto/howto_css_image_overlay.asp
you probably need to use javascript as well, and do an EventListener to tell when it is being hovered over, and then use .style to change it, for example:
var text = document.getElementById("text");
var exampleimg = document.getElementById("exampleimg");
exampleimg.addEventListener("mouseover", examplechange);
exampleimg.addEventListener("mouseout", examplechangeback);
function examplechange(event)
{
text.style.display = "block";
}
function examplechangeback()
{
text.style.display = "none";
}
add a h1/h2/h3/p element to your page, and give it the id "text" then style it how you want and set the display to none.

how to change background color of a label in QT

I am developing calculator using qt framework. I have put a label for display the entered number and answer so I want to change the color of this label. How can I do that.
label = new QLabel("0",this);//label for the text inputs
label -> setGeometry(QRect(QPoint(75,25),QSize(50,200)));
please help
You can use Qt Style Sheets
QLabel* label = new QLabel("Hello");
label->setStyleSheet("background: red");
setStyleSheet("background-color: white;");

Spritebuilder CCTextField how to set placeholder and color?

I want to ask how to set CCTextField placeholder and color.
I know it is easy to create a text field on spritebuilder, but it cannot set the text color and placeholder like UITextField.
yourTextField.textField.attributedPlaceholder = [[NSAttributedString alloc] initWithString:#"Placeholder String" attributes:#{NSForegroundColorAttributeName: [UIColor grayColor]}];
Same thing if you have to use the text too. Use the property .attributedText
When I had this problem I had to change a Cocos2d file:
cocos2d-ui/Platform/iOS/CCPlatformTextFieldIOS.m
- (id)nativeTextField
{
return _textField;
}
I would recommend just trying to use attributed string before changing cocos2d files. I'm using cocos2d v3 and xcode 6.1.1

Calculating Text Width In ActionScript And Flex

I'm trying to calculate how WIDE to make my button, based on the text that it will contain, and when I try to google for how to calcuate something as simplistic as the WIDTH OF SOME TEXT, I go cross-eyed just trying to wade through apparently nonsensical esoteric counter-intuitive voodoo. Can anyone out there help simplify for me how I would write a function like this:
public function HowWideWouldThisTextBeIfItWereInThisButton(Text:String,Container:Button):int {
...
}
Thanks in advance.
So long as you're in a UIComponent, you can use the measureText function.
public function howWideWouldThisTextBeIfItWereInThisButton(text:String,container:Button):int {
var lineMetrics:TextLineMetrics = container.measureText(text);
return lineMetrics.width;
}
That being said, the flex button component should automatically size to the width of the text, if you don't set a width on it. That way if you need the text width, you can just call use the textWidth property.
This works any format, size, font type. Don't forget properties "autoSize" and "wordWrap"!
var tf:TextField = new TextField();
addChild(tf);
tf.autoSize = TextFieldAutoSize.LEFT;
tf.wordWrap = false;
tf.text = "Whatever here";
tf.width = tf.textWidth + 4; // add 2 pixels-gutters left & right
Your button will need to be "tf.width" wide...
Here's how you do it in Spark:
I've modified - simplified - his example a bit here:
var textMetrics:TextLineMetrics = label.measureText( label.text );
var textWidth:int = textMetrics.width;
Here's a way that works also:
var tempText:Text = new Text();
tempText.regenerateStyleCache(false);
var textWidth:int = tempText.measureText(*yourstring*).width;
as I think, textField.textWidth construction works fine... until you change the font size.
It seems it calculates width based on 12px font.
So, if you have embedded font and global styling you can try fast solution:
var realWidth = myLabel.textField.textWidth * (fontSize / 12);
I've tried this on long and short strings and the result is correct.
Joshua, it really helps to be clear. Are you talking TextField, MX Label, Spark Label, RichText, etc? Different text components use different text engines, such as FTE and TLF and may have different solutions. I certainly wish Adobe had a good set of utilities or sample code which could predict what the size of font rendered onto the controls would be, before you actually do it. But, the good news is that in certain cases - like, a good old fashioned TextField, you can predict this pretty well. You just make a TextField, set it's textFormat field, auto size method and the text. You should be able to get it's size before adding it anywhere. I don't remember what the order was, but, I remember the order you set those properties matters. If you can't figure out how to do it, I can provide a code example. Now, for the new, "improved", components such as Spark Labels - I'll be buggered if I can find a damn way... spent a number of hours on this and haven't found a way.. or someone who knows a way :P.
Following up my comment on quoo's answer, here's the code for same purpose, but just grabbing the width out of a TextField, using TextLineMetrics as well:
public function mtxtWidth(container:TextField):int {
var lineMetrics:TextLineMetrics = container.getLineMetrics(0);
return lineMetrics.width;
}
Sounds like you could use textWidth

changing cell background color in qt

i'm new to pyqt , and i'm still facing some newbie problems :D
i have a QTableWidget that is item delegated on a QChoice control ( hope i said it right )
i need to have the cell background color changes whenever a user change the choice control selection
briefly: how to change a cell background color in a table widget ??
i use pyqt4 and python 2.6
thanx in advance
I used something like this:
brush = QtGui.QBrush(QtGui.QColor(255, 0, 0))
brush.setStyle(QtCore.Qt.SolidPattern)
item.setBackground(brush)
Where item is QTableWidgetItem object
Use
QTableWidgetItem QTableWidget.item(row, column)
and
QTableWidgetItem setData(role, data)
with
Qt.BackgroundRole
as follows:
table.item(0, 0).setData(Qt.BackgroundRole, color).
And read about the Roles mechanism used in Qt Model/View.
if you use QTableView use this:
model.setData(model.index(0, 0), QVariant(QBrush(Qt::red)), Qt::BackgroundRole);
Here are some useful lines of code. Sorry for redundancy, I'm trying to gain some reputation.
QStandardItemModel* model = new QStandardItemModel(numRows, numColumns);
QStringList headers;
headers.append("Date");
model->setHorizontalHeaderLabels(headers);
QStandardItem* item = new QStandardItem(text);
item->setData(Qt::AlignCenter, Qt::TextAlignmentRole);
item->setData(QVariant(QBrush(Qt::green)), Qt::BackgroundRole);
model->setItem(row, column, item);
or simply:
item->setBackground(Qt::green);
Hey, you set the delegate method for the table widget. in the paint event of the delegate you handle the color changing technique..
have a look at this example,here they have done custom selection color. same way you handle the item cell painting
For supplement in C++ way, if you want to paint custom color unlike Qt::red and so on, you can do something like :
ui->tableWidget->item(i, j)->setBackground(QColor(152,234,112));

Resources