Style anomalies

[flyingdutchman]

For those out there working on skins for  Poweamp v3. I thought it might be useful to open a topic to exchange ideas, questions or thoughts so that we all may benefit from eachothers knowledge.

To kick off:

 <item name="com.maxmpz.audioplayer:colorBgPrimary">@color/transparent</item>

This is the background for Library Album, Track info etc BUT ALSO for Menus when selecting in library or Track Menu so you cannot read the menus.

in the style Base_ActivityTheme_Default.

Any ideas on overriding the background of menus at Theme level ??

[maxmp]

Thanks for the findings. You can also post an issue on githab, alternatively.

While the color defined this way, you can always override the styles which use this color and use your defined color as you want (that can be color value directly, @color value or your own skin attribute).

[flyingdutchman]

Still struggling to get a background on popup menus

Scenario: 

<!-- This is the background for Library album, track info
BUT ALSO for Menu when selecting in library
so you cannot read the menus-->
<item name="com.maxmpz.audioplayer:colorBgPrimary">@color/transparent</item>

so colorBgPrimary sets background for both text and menus. Given I want to remove the background on text such as artist and track title and in Library, all popup menus are also transparent.

Although Max has helped on how to set the background on the ItemTrack, I am still struggling to set backgounds in all the other places. In addition, the background for the "hamburger" menu on the Navbar does not appear to be affected once Navbar is set to transparent.

All I am trying to achieve is no background on text labels and all popups/menus to have the same background.

Anyone on the forum that is willing to help?

ps worked trhough a number of potential objects listed in the layout-sw1 folder without success

[flyingdutchman]

Continuing .....

I am trying to move the 

com.maxmpz.audioplayer:ItemTrackTitle_scene_aa

and

com.maxmpz.audioplayer:ItemTrackLine2_scene_aa

to the right hand side of 

com.maxmpz.audioplayer:ItemTrackAAImage_scene_aa

where 

com.maxmpz.audioplayer:ItemTrackLine2_scene_aa

is aligned below 

com.maxmpz.audioplayer:ItemTrackTitle_scene_aa

just as in the sample skin.

However, applying normal 

com.maxmpz.audioplayer:layoutAttachRight , Left, Top, Bottom do not appear to have any of the expected effects. Both text fields either move to the top left or bottom left.

It is as if 

com.maxmpz.audioplayer:ItemTrackTitle_scene_aa and com.maxmpz.audioplayer:ItemTrackLine2_scene_aa both "match_parent" and so tage up the whole left hand side top to bottom

As this should be (IMHO) a fairly easy thing to do, applying normal layout parameters, there must be something else going on which I have not discovered yet.

My question to @maxmp is is it possible to publish the layout xml of TOP ? (Apart from explanatory text, style definitions etc in the development kit I did not find anything explaining the way layouts are constructed. A diagram would also be useful.

At the moment it is searching for a needle in the haystack and guess work.

Any help from forum members is of course also welcome.

[maxmp]

The “top” layout is activity_list_fast.xml - https://github.com/maxmpz/powerampapi/blob/master/poweramp_skin_sdk/reference_resources/layout-sw2dp/activity_list_fast.xml

You’re probably more interested in the track item layout, which is item_track.xml - https://github.com/maxmpz/powerampapi/blob/master/poweramp_skin_sdk/reference_resources/layout-sw2dp/item_track.xml

To redefine attachment completely don’t forget first reset the “original” attachment to @null (by specifying in your style something like com.maxmpz.audioplayer:layout_attachLeft=“@null”) as otherwise that attachment is still derived from the original style rule and applied.

 

[flyingdutchman]

Thank you for the quick response. Given the @null tip, things may behave differently. I will carry on trying to get to grips with this. Once this is resolved, i will attempt to show/hide the prof buttons and waveseek/seekbar.

[invaderzim]

Cheering you on! Good luck, man.

[flyingdutchman]

@invaderzim thanks, need all the help i can get!!

[flyingdutchman]

the style

<item name="com.maxmpz.audioplayer:colorIconPrimaryForced">@color/Crimson</item>

is applied to the icons above when in library view. However, when viewing an album, the same scene is shown but clearly does not have the same style(s) applied

Is this intentional?

 

In addition,

I have overriden all scenes with

<item name="com.maxmpz.audioplayer:cornerRadius">@dimen/cornerRadius</item><!-- Tracks -->
<item name="com.maxmpz.audioplayer:cornerRadius2">@dimen/cornerRadius2</item><!-- Albums -->
<item name="com.maxmpz.audioplayer:cornerRadius3">@dimen/cornerRadius3</item><!-- Others -->

where the values have been set to 0 so no round corners.

It works pefect for all scenes but for Artists, List Options,List Small.

the albumart is shown rounded.

 

[maxmp]

The "inverse" color (by default this would be black for light theme, and white for dark theme) is not applied for album (etc. headers with image on background) as there is black background for those icons, and there is not attribute color for those icons, as default raw icon color (white) is used.

You can redefine appropriate button styles, if the color should be local to specific views or/and scenes (these styles are already in Sample Skin):

<item name="com.maxmpz.audioplayer:ItemHeaderShuffleButton">@style/ItemHeaderShuffleButton</item>

<style name="ItemHeaderShuffleButton" parent="com.maxmpz.audioplayer:ItemHeaderShuffleButton">
   <item name="android:background">@drawable/ripple_button</item>
   <item name="com.maxmpz.audioplayer:drawableTint">YOUR COLOR</item>
</style>

The top text headers color can be redefined either via these colorIconInverseForced (dark) / colorIconPrimaryForced (light) colors or via separate styles, e.g.:

<item name="com.maxmpz.audioplayer:ItemTextHeaderShuffleButton">@style/ItemTextHeaderShuffleButton</item>

<style name="ItemTextHeaderShuffleButton" parent="com.maxmpz.audioplayer:ItemTextHeaderShuffleButton">
   <item name="com.maxmpz.audioplayer:drawableTint">YOUR COLOR</item>
</style>

You can find the styles which should be redefined here:
https://github.com/maxmpz/powerampapi/blob/master/poweramp_skin_sdk/reference_resources/layout-sw2dp/merge_item_header.xml
(ItemHeaderShuffleButton, ItemHeaderPlayButton, ItemHeaderSelectButton)

and here (text headers):
https://github.com/maxmpz/powerampapi/blob/master/poweramp_skin_sdk/reference_resources/layout-sw2dp/merge_item_text_header.xml
(ItemTextHeaderShuffleButton, ItemTextHeaderPlayButton, ItemTextHeaderSelectButton)

+ menu (3 dots button) (search for android:id="@+id/menu" in reference files).

[flyingdutchman]

3 hours ago, flyingdutchman said:

It works pefect for all scenes but for Artists, List Options,List Small.

the albumart is shown rounded.

Thank you so much for all your help. Much appeciated.

Any thoughts about why albumart in Library, Artist, List Options, List Small does not apply the 

@dimen/cornerRadius3 (value=0)

[Mrmahdi]

@flyingdutchmanAre devices with a 6-inch (phablet) screen in your app defined, maybe because of this I can not use.

[flyingdutchman]

No, it would only affect layout. My skin is is no different than any of the others. The differences are in the style definitions eg instead of placing the albumtext over the albumart, i tell it to move to x,y position.or instead of using black background i use transparent colour.

 

[Mrmahdi]

@flyingdutchmanI currently use the theme 2 theme and other themes of this developer, but your theme and the andrew0 themes are not running on my device, as well as the sample themes run without problems.

[flyingdutchman]

interesting, there clearly is something going on

I just received an email from 77 Tiger who has the same issues both with my skin and andrewo's so yes I suspect it is a layout issue. Best to continue this thread under "Yet Another Poweramp Skin YAPS

https://forum.powerampapp.com/topic/15552-yet-another-Poweramp-skin-yaps/?tab=comments#comment-64037

 

I will investigate your device Huawei mate 7

[flyingdutchman]

One step forward two steps back.

With the information Max provided (see above ) I have been able to change the Shuffle, Play and Select icons on dark backgrounds.

However, I cannot find any reference to the icon at the top (Back) and the text (I believe there are 2)

Furthermore, the circle/square has dissappeared

 

Anyone that can help?

 

[Mrmahdi]

9 hours ago, flyingdutchman said:

interesting, there clearly is something going on

I just received an email from 77 Tiger who has the same issues both with my skin and andrewo's so yes I suspect it is a layout issue. Best to continue this thread under "Yet Another Poweramp Skin YAPS

https://forum.powerampapp.com/topic/15552-yet-another-Poweramp-skin-yaps/?tab=comments#comment-64037

 

I will investigate your device Huawei mate 7

Thank you for your good response, help me out?

[Andrew0]

@maxmp

Hi Max,

on one of my skins I found a problem on the help screen, I can't change the background of the pop ups. My research is that I can't reference "TopHelp" style on the "styles-top.xml" file as it isn't included on the "attrs-styles-powerui.xml" file. Could you maybe fix this so that I can customize the help screen as well?

Greetings

[maxmp]

@Andrew0 Right, help hint styles are not exposed, so please try not to override colorStrokeHelp / colorBgHelp. These colors are used only in help.

Alternatively, you can override colorStrokeHelp/colorBgHelp/colorIconPrimary/textColorPrimary => these colors are used for TopHelp

[maxmp]

On 11/27/2018 at 6:43 PM, flyingdutchman said:

Thank you so much for all your help. Much appeciated.

Any thoughts about why albumart in Library, Artist, List Options, List Small does not apply the 

@dimen/cornerRadius3 (value=0)

Dimen is just a value. It not directly corresponds to anything, unless specified in theme.

As for Artist images radiuses, these are "cornerRadius3" attributes in ItemTrackAAImage* styles.

List Small zoom level is a base style for list items, thus it's just "ItemTrackAAImage" (search in styles-item.xml) => it uses:

<item name="cornerRadius3">?corners_aa_other</item>

 

[maxmp]

19 hours ago, flyingdutchman said:

However, I cannot find any reference to the icon at the top (Back) and the text (I believe there are 2)

See ItemTrackBackDecor*, ItemTopTextBackDecor*, and ItemTextBackDecor* styles in styles-item.xml. Be careful with margins/paddings there, as any change to that may break animation, as backdecor is a separate control and synchronized with title animation.

The style applied depends on actual parent category and header type (see layout-sw2dp/ item_back_decor.xml, item_top_text_back_decor.xml, item_text_back_decor.xml).

19 hours ago, flyingdutchman said:

Furthermore, the circle/square has dissappeared

The "circle" is a background => check how exactly you replaced background. If you replaced it to some plain transparent color or @null, you have nothing.
There are ready-to-use drawables with no background available (and used e.g. in top  library categories) => see e.g. drawable-sw2dp/ripple_inverse_rounded_large.xml and  similar

(can be used directly as e.g. @com.maxmpz.audioplayer:drawable/ripple_inverse_rounded_large) or you can copy one of those drawables from reference resources, change it as needed and use it.

[flyingdutchman]

Once again, thank you. There is so much new stuff to learn!!!

[marcony]

Is there a way to put title in the center and then artist below title?

[flyingdutchman]

7 hours ago, marcony said:

Is there a way to put title in the center and then artist below title?

Centered where? For small devices the track title is centered above the albumart, artist is hidden

[flyingdutchman]

@maxmp, correct me if I am wrong but as I have been struggling with placing the seekbar, I noticed that looking at  the standard skins (light , dark) the seekbar does not show even when selected. Nor does it show in the Sample Skin from the Poweramp master package. Only the Sample Skin Alternative layout shows the seekbar. 

My own experience with trying to position the seekbar below the waveseek appears to be impossible, even with moving the seekbar to its own layout. Neither was I able to poition the seekbar anywhere else.