Customizing Cheeky Radio Pro: Difference between revisions
From Cheeky Factor
(Created page with "{{Header |Status=Archived |PubDate=2019-02-03 |Categories=Apple |The problem=You have downloaded Cheeky Radio Pro, you have tested it and it works. Now it’s time to customize the App for your needs. Thankfully, most of the hard work has been taken care of, you just need get your stream(s), change the images and the links to your station App for news and your website. }} {{How to guide |Device=iPhone |Operating system=iOS |Software=Xcode |Guidance==== Changing the lo...") |
No edit summary |
||
| Line 11: | Line 11: | ||
|Operating system=iOS | |Operating system=iOS | ||
|Software=Xcode | |Software=Xcode | ||
|Guidance==== Changing the look and feel === | |Guidance====Changing the look and feel=== | ||
To change the look, we need to change the imagesets. | To change the look, we need to change the imagesets. | ||
| Line 20: | Line 20: | ||
The main directories in the images.xcassets you need to be concerned with are: | The main directories in the images.xcassets you need to be concerned with are: | ||
* AppIcon.appiconset – this is where your apps icons are located, | *AppIcon.appiconset – this is where your apps icons are located, | ||
* LaunchImage.launchimage – this is the image you see when the app first launches, | *LaunchImage.launchimage – this is the image you see when the app first launches, | ||
* background.imageset – this is the background to the app, you will need to change this to fit your stations design, | *background.imageset – this is the background to the app, you will need to change this to fit your stations design, | ||
* logo.imageset – this is your stations logo, | *logo.imageset – this is your stations logo, | ||
* swift-radio-black.imageset – this is another location for the stations logo, this is for a version that is on a black background. | *swift-radio-black.imageset – this is another location for the stations logo, this is for a version that is on a black background. | ||
The other directories are up to you if you change, the purpose of these are: | The other directories are up to you if you change, the purpose of these are: | ||
* albumArt.imageset – this is a default image when the station is playing on the off chance you don’t have any images assigned to the track being played, | *albumArt.imageset – this is a default image when the station is playing on the off chance you don’t have any images assigned to the track being played, | ||
* btn-close.imageset – this is the close button, | *btn-close.imageset – this is the close button, | ||
* btn-nowPlaying.imageset – this is the button to show what is playing at that time, | *btn-nowPlaying.imageset – this is the button to show what is playing at that time, | ||
* btn-pause.imageset – this is the pause button, | *btn-pause.imageset – this is the pause button, | ||
* btn-play.imageset – this is the play button, | *btn-play.imageset – this is the play button, | ||
* icon-hamburger.imageset – this is the hamburger to open more options such as about the station, go to your website and any other apps associated with the station, | *icon-hamburger.imageset – this is the hamburger to open more options such as about the station, go to your website and any other apps associated with the station, | ||
* icon-info.imageset – self explanatory, tis is the information icon, | *icon-info.imageset – self explanatory, tis is the information icon, | ||
* share.imageset – this is the share image, | *share.imageset – this is the share image, | ||
* slider-ball.imageset – this is the slider ball for the volume control, | *slider-ball.imageset – this is the slider ball for the volume control, | ||
* stationImage.imageset – this is the default image for the station if you do not have one assigned, | *stationImage.imageset – this is the default image for the station if you do not have one assigned, | ||
* vol-max.imageset – this is the speaker showing the volume on maximum, | *vol-max.imageset – this is the speaker showing the volume on maximum, | ||
* vol-min.imageset – this is the speaker showing the volume is on minimum. | *vol-min.imageset – this is the speaker showing the volume is on minimum. | ||
For those of you who have noticed, I know I have missed a few. These are: | For those of you who have noticed, I know I have missed a few. These are: | ||
* NowPlayingBars.imageset | *NowPlayingBars.imageset | ||
* NowPlayingBars-0.imageset | *NowPlayingBars-0.imageset | ||
* NowPlayingBars-1.imageset | *NowPlayingBars-1.imageset | ||
* NowPlayingBars-2.imageset | *NowPlayingBars-2.imageset | ||
* NowPlayingBars-3.imageset | *NowPlayingBars-3.imageset | ||
These are the bars that mimic a graphic equaliser effect. | These are the bars that mimic a graphic equaliser effect. | ||
| Line 53: | Line 53: | ||
Finally: | Finally: | ||
* station-80s.imageset | *station-80s.imageset | ||
* station-classicrock.imageset | *station-classicrock.imageset | ||
* station-killrockstars.imageset | *station-killrockstars.imageset | ||
* station-spaceland.imageset | *station-spaceland.imageset | ||
* station-sub.imageset | *station-sub.imageset | ||
These are what come with Swift Radio Pro, I have left them in place at the moment, I may remove them in the future. These are the icons that are called by the Swift Radio Pro stations. | These are what come with Swift Radio Pro, I have left them in place at the moment, I may remove them in the future. These are the icons that are called by the Swift Radio Pro stations. | ||
With the images, modify to how you want them to look. | With the images, modify to how you want them to look. | ||
}} | |||
{{How to guide | |||
|Device=iPhone | |||
|Operating system=iOS | |||
|Software=Xcode | |||
|Guidance==== Assigning stations === | |||
In Xcode, locate the files stations.json, it is located in CheekyRadio_Pro/Data: | |||
[[File:Assignig stations.png|alt=This shows the Stations.json when open in Xcode.|none|frame|Stations.json in Xcode]] | |||
Modify to your needs and save. | |||
The name is the name of the station. | |||
The streamURL is the URL to your stream (ideally M3U). | |||
The imageURL is the location of where your station logo is located, this will be displayed in the play section and where your station button is. | |||
desc is the short description of the station. | |||
And finally, the longDesc is the long description of the station. | |||
This may be a good point to make sure it is all working. | |||
}} | }} | ||
Revision as of 21:41, 12 November 2023
Status: Archived
Publication date: 2019-02-03
Last edited by: Garyf
Last updated: 2023 - 11 - 12
The problem
You have downloaded Cheeky Radio Pro, you have tested it and it works. Now it’s time to customize the App for your needs.
Thankfully, most of the hard work has been taken care of, you just need get your stream(s), change the images and the links to your station App for news and your website.
The resolution
Please note: cheekyfactor.com or the owners of this site cannot be held responsible if things go wrong. You perform these tasks at your own risk.
Device: iPhone
Operating system: iOS
Software: Xcode
Guidance for iPhone, iOS, Xcode
Changing the look and feel
To change the look, we need to change the imagesets.
First of all, you may need to download the Apple design resources. I am using GIMP, hence I needed to download the PSD files.
Cheeky Radio Pro Images.xcassets
Navigate in the your finder to:
CheekyRadio_Pro/CheekyRadio_Pro/Images.xcassets
The main directories in the images.xcassets you need to be concerned with are:
- AppIcon.appiconset – this is where your apps icons are located,
- LaunchImage.launchimage – this is the image you see when the app first launches,
- background.imageset – this is the background to the app, you will need to change this to fit your stations design,
- logo.imageset – this is your stations logo,
- swift-radio-black.imageset – this is another location for the stations logo, this is for a version that is on a black background.
The other directories are up to you if you change, the purpose of these are:
- albumArt.imageset – this is a default image when the station is playing on the off chance you don’t have any images assigned to the track being played,
- btn-close.imageset – this is the close button,
- btn-nowPlaying.imageset – this is the button to show what is playing at that time,
- btn-pause.imageset – this is the pause button,
- btn-play.imageset – this is the play button,
- icon-hamburger.imageset – this is the hamburger to open more options such as about the station, go to your website and any other apps associated with the station,
- icon-info.imageset – self explanatory, tis is the information icon,
- share.imageset – this is the share image,
- slider-ball.imageset – this is the slider ball for the volume control,
- stationImage.imageset – this is the default image for the station if you do not have one assigned,
- vol-max.imageset – this is the speaker showing the volume on maximum,
- vol-min.imageset – this is the speaker showing the volume is on minimum.
For those of you who have noticed, I know I have missed a few. These are:
- NowPlayingBars.imageset
- NowPlayingBars-0.imageset
- NowPlayingBars-1.imageset
- NowPlayingBars-2.imageset
- NowPlayingBars-3.imageset
These are the bars that mimic a graphic equaliser effect.
Finally:
- station-80s.imageset
- station-classicrock.imageset
- station-killrockstars.imageset
- station-spaceland.imageset
- station-sub.imageset
These are what come with Swift Radio Pro, I have left them in place at the moment, I may remove them in the future. These are the icons that are called by the Swift Radio Pro stations.
With the images, modify to how you want them to look.
Device: iPhone
Operating system: iOS
Software: Xcode
Guidance for iPhone, iOS, Xcode
Assigning stations
In Xcode, locate the files stations.json, it is located in CheekyRadio_Pro/Data:
Stations.json in Xcode
Modify to your needs and save.
The name is the name of the station.
The streamURL is the URL to your stream (ideally M3U).
The imageURL is the location of where your station logo is located, this will be displayed in the play section and where your station button is.
desc is the short description of the station.
And finally, the longDesc is the long description of the station.
This may be a good point to make sure it is all working.
