• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

Is there a way to merge a a png and text in Muse? Thanks.

Community Beginner ,
Jan 01, 2018 Jan 01, 2018

Copy link to clipboard

Copied

Is there a way to merge a rectangle and text in Muse?

For now im using a hover effect who change the color on the text to white.

But i want the triangle"png" beside the text to be merged with the text. In that way also the png gets white when i hover on the text.

Views

1.0K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

LEGEND , Jan 01, 2018 Jan 01, 2018

https://forums.adobe.com/people/Crille+My+man  wrote

But i want the triangle"png" beside the text to be merged with the text. In that way also the png gets white when i hover on the text.

use the state button widget for this... set the roll over state first then the normal state

Votes

Translate

Translate
Advocate ,
Jan 01, 2018 Jan 01, 2018

Copy link to clipboard

Copied

Make a graphic (button) of the text within and rectangle.

In Photoshop you can make a 4 stage (the 4 hover stages) button that works fine in Muse.

Normal

MouseOver

MouseDown

Active

Design each state to your liking.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 01, 2018 Jan 01, 2018

Copy link to clipboard

Copied

What do you mean with button? For now im using a png , which is from ai. And i currently have it white on Mouseover , Mousedown , Active. But i want to group them? Sorry my bad..

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 01, 2018 Jan 01, 2018

Copy link to clipboard

Copied

If I grasp what you wish to accomplish, you can set a background Image in the container that holds the image.

Set the PNG image as a background fill.

The background image can vary between the various states.

In these sample images you see the downward triangle in the normal state

however it isn't present in the active state (just as an example)

Screen Shot 2018-01-01 at 4.37.54 PM.png

Screen Shot 2018-01-01 at 4.38.04 PM.png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 01, 2018 Jan 01, 2018

Copy link to clipboard

Copied

https://forums.adobe.com/people/Crille+My+man  wrote

But i want the triangle"png" beside the text to be merged with the text. In that way also the png gets white when i hover on the text.

use the state button widget for this... set the roll over state first then the normal state

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

I don't know if Im doing wrong or what , but when I use the "state button widget" you can see the big button behind the text.

( I just want the text and the triangle to be visible ) not the button. And when i delete the fill on the button, it dosent work..

So ?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

https://forums.adobe.com/people/Crille+My+man  wrote

I don't know if Im doing wrong or what , but when I use the "state button widget" you can see the big button behind the text.

( I just want the text and the triangle to be visible ) not the button. And when i delete the fill on the button, it dosent work..

So ?

state button example

if you want exact fix then give us something to work with mate

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

Well, i thought there just was an easy way to merge two thing , just like in Photoshop. But i guess it's not..

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

Like this..

Skärmbild (236).pngSkärmbild (237).pngSkärmbild (238).png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

They are not merged, so they won't belonging to each other -->

So when i touch the " SHOP ",  the "  SHOP " text gets white, but not the triangle next to it.

The same when i touch the " TRIANGLE" , the " TRIANGLE" gets white, but not the shop text next to it.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

it doesn't "get white"... (only the rollover state) you set the text to zero

Screenshot (425).png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

There are probably many "easy ways", if you only would tell us exactly(!), what you are looking for!

Her an example .muse file with some ways to the solution, you seem to achieve: https://www.dropbox.com/s/q673lx83bsiegm3/text-and-icon-color-change.muse?dl=0

„Merging“ is a term used from image editors. In a web design application, you can’t „merge" different elements, among other reasons, because the HTML output won’t support this.. You even can’t do this in a layout application.

Therefore you have to go different ways to achieve, what you want. I hope, I nailed it within my sample file.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

Thanks, hehe. How do i delete this post

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

  • Why do you want to „delete this post“?
  • Does „hehe“ mean, your issue is fixed?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

I mean , It's working on your "file". But when i make the same on my muse file it isnt working.

Skärmbild-(239).png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

I pressed Post... The thing I was going to say was.

On your project the " state button " is the group leader, and inside the group you can find the text + triangle.

But in my project it isnt like that. How do i make the state button to the " group leader "

Hope you understand me .

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

This is a picture from your file " the state button is the leader.Skärmbild-(240).png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

You read, what you are writing? You say, in my sample the state button is the group leader, and you ask, how to make the state button the group leader? Frankly spoken: No, I don‘t understand, what you want.

My god, give us a .muse file to see your issue, and stop this question and answer game!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

Don't you understand me?

On the last picture you can that the " State Button " is the leader of the group .

But on the first picture " my file" you can see that it isnt like that.

My State Button isnt the group leader.

In my file i do first have a normal group and inside that the " triangle + text + state button ".

I think that's the problem. I have to group the State Button with the text + triangle.

Sorry im new to Muse.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

you can see *

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

What's so secret about your muse Crille My man, that you could not share it with us? Günter Heißenbüttel​ still patient and asking for a muse ( Ussnorway​ asked earlier as well ).

Trust us, trust him, with a .muse this issue is solved in seconds. With answer and question you'll probably never get the solution.

Happy new year and best Regards,

Uwe

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

It's not secret. I just want the design as it is but the state button fixed.

Here it is . Dropbox - CLEAR ENEMY.muse

Just fix it .

Thanks

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

I reduced your file much more by deleting all unrelated elements (logos, text,hidden objects, pages, … – in short all, what makes life easier for „helpers")

The remaining rest („Rocket League“ + icon) demonstrates the solution:

Place the state button into the composition target, under the icon and the „Rocket League“ text frame.

Select the icon, go to Muse’s upper control strip and assign the effect „inner glow“ with no transparency and a large glow radius. You may achieve this as well by placing a second icon with a different colour in rollover state, but the inner glow effect is quite hand for this, as far as the image is a PNG with transparent areas).

Here you can download the modified and reduced sample file: https://www.dropbox.com/s/9gimqr9arc994db/CLEAR%20ENEMY_Mod.muse?dl=0

Screen1.jpg

Screen2.jpg

One more crucial hint: Avoid using system fonts! They have to be converted to images during output and therefore not correct, if the page is responsive. Why? Read my answer #4 here: https://forums.adobe.com/thread/2357163

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

Also, how do i make the " Esport + Triangle " white on rollover?

I made the same thing like on the Rocket league text + icon.

But it dosent work , is it just because of the trigger?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 02, 2018 Jan 02, 2018

Copy link to clipboard

Copied

LATEST

https://forums.adobe.com/people/Crille+My+man  wrote

Also, how do i make the " Esport + Triangle " white on rollover?

I made the same thing like on the Rocket league text + icon.

But it dosent work , is it just because of the trigger?

the example file from

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines