You are on page 1of 11

StartingGuidelines:

1. HowIcanimportprojectatAndroidStudio?
Afterpurchasing Company Profile template fromcodecanyonthefirsttaskis
to importthe project in androidstudiosothatyoucanmodifythecodeasyou
want. We recommend to use Android Studio 2.0 (previewversion)towork
with our source code. After installing Android Studio openit. Fromwelcome
screen select Open an existing Android Studio project select
downloaded source code and press OK. Android Studio will take care of
buildingtheprojects.

2.
How
Ican changetheappname?
Aftersuccessful import onandroid studiogoto res valuesstrings.xml
from project tab on left sidebar.Afteropening
strings.xml youwillgetlotsof
name attribute with
<string></string> tag. Now press ctrl+R and type
app_name. Result will be shown with highlighted effect. Now replace
Audacity withyourcompanyname!

3.
HowIcanchangethepackagenameoftheproject?
For changing the package name to your desired one you have to go to
Gradle Scripts build.gradle (Module: app) file and find forthekeyword
applicationId and change the value com.audacityit.audacity with your
desired app id. Remember thatthe appid should be unique becausegoogle
play and android device will recognize your app using this app id. If
duplicationfoundyouwontbeabletouploadyourapptogoogleplay.

4. HowIcanchangetheapplogo?
Whatistherequiredsizeofapplogo?
WhatimageformatIshouldtouseforapplogo(jpg/png)?

Now time to change the app logo (launcher icon). For changing the icon
goto New Image Assetbyrightclickingon appfrom projecttab.You
will get newwindow here.Keep unchanged the Asset Type to Launcher
Icons . Now browseto your iconbypressing
button on right most side
of
Image File section. You will see a preview of your iconyou selected.
You can change the decoration using several option as your wish. Now
press Next and
Finishtoeffectthechanges.Appiconischangednow!

You can alsoimport appicons manually.Forthat youvetodesign 5(five)
icons of different sizes of your company logo. Sizes are given below.
Remember to rename the icons name by ic_launcher . Pastethosefiles
into res mipmap according to different dpi version you made. It will
replacethetheexistingiconswithyournewlydesignedappicon.
48x48(mdpi)
72x72(hpdi)
96x96(xhdpi)
144x144(xxhpdi)
192x192(xxxhpdi)
Itisrecommendedtouselaunchericonsinpngformat.

5. HowI

can
translateprojecttomylanguage(RTLSupport)?
Currently this feature (RTLSupport) is not available. But if you want to
addthisfeature youveto make necessary resources andmodifythedata
structurebyyourself.

6. IsGoogleAnalyticsisavailabletotheproject?Ifyes,howtouseit?
Yes. Google Analytics is already implemented with screen and event
tracking functionality. Active your app profile from
here and collect your
apptrackerid (ga_trackingIdi.e:UAXXXXXXXXX).
Now goto res xml app_tracker.xml andsearchfor your_tracker_id
andreplaceitwithyourown apptrackerid.

SplashPage:

1. HowI
can
changemysplashscreenbackgroundcolour?
Open ColorUtil by going to
app javacomaudacityit.audacity
util ColorUtil. How I
can change my splash screen background
colour? Search for SPLASH_SCREEN_COLOR andchange #13153E
to
yourdesiredhexadecimalcolor.

2. HowI
can
changemysplashscreencompanylogo?
Goto res drawable and replace app_inside_logo.png with your
company logo for splash screen. Remember to keep the same name
which you want to replace. Otherwise the logo will be unchanged. Paste
your logo there. If
ChooseDestination Directory windowappearalways
choose .../app/src/main/drawablexhdpi as the destination folder. This
folder is recommended as the destination folder for image resources we
willchangefromnow.

3. Whatistherequiredsizeofsplashscreencompanylogo?
We are using app_inside_logo.png as company logo inside app. This
logo becomesresponsiveinsizewhenrunonlargescreendeviceliketab.
Also it is using in two(2) more separate screens. So weve used
comparativelyhighresolutionimagetomeettherequirementwithonlyone
image. We are using 865 x 490 pixel. We will not suggest you tofixthe
image dimension in a specific size buttryto keepthe aspect ratio as we
usedinouricon.
4. Canchangethewholeappcolorscheme?
You can changethe colorschemebychangingthecolorvalueofdifferent
attribute name. For that open colors.xml by going to res values
colors.xml from project tab on left side bar. You will find
toolbarColor ,
statusBarColor ,
activityColor (background colorofthe contentscreen).
You can change those corresponding hexadecimal values with your
preferablecolor.

Leftnavigationdrawer:

1. HowIcanchangetheleftnavigationdrawerheaderbackgroundimageand
companylogo?Whatistherequiredsizeofthoseimages?
You can change the header background image by changing/replacing
img_nav_header.jpg in
res drawablefolder. You canuse.pngimage
here but before doing that youve to delete the existing
img_nav_header.jpg image first. Always try to keep the same name of
the image whatever youre replacing otherwise the change will not be
affected. Here we have used400x226 px image. Youcan use yourown
size. But we highly recommend to not touse veryhighresolution image.
Alsokeepconcernabouttheaspectratio.Youcanfollowourgivensize.
The company logo used in splash screen (see Splash Page FAQ 2) is
also usingin this section. SoIfyouvealreadychangedthelogoanddont
want to change it any more you can skip this step. But if you want to
change the logo you should import a new logo to the res drawable
folderandreferthefilenameyouimportedtothe nav_header_layout.xml
line number 18 (Go to res layout nav_header_layout.xml ) . Just
replace app_inside_logo with your imagefile name.Pleaseavoid to put
thefiletypehere(i.e:app_inside_logo .png
).Checkout this
.
To change header view height goto resdimens.xml and doubleclick
to open the file. You will get
header_view_height with value 150dp.
Change the value( i.e: 170dp, 190dp etc.)followed by . dp
dp is theunit.
Sodontremove dp.
You can also change header view company logo size. Just follow as
describedinpreviousstep.Changethevalueof header_view_logo_width
andheader_view_logo_height .

2. HowI
can changethephonenumber,emailandwebsiteurl?
Go to res values strings.xml and search for dev_phone ,
dev_mail,
dev_web_page. Changethecorrespondingvalueswithyours.

3. HowI
can changethecomponenticonattheleftnavigationdrawerandwhatis
therequiredsize?
Go to res drawable and you find several icons starting with the text
ic_nav_ . These icons are related to the navigation view (sidebar). You
can change the icons by replacing those with your icons. We highly
recommend to use 48 x 48 px (xhdpi) image for sidebar icons. Also
recommended to use white color transparent background icon for
sidebar. Otherwise the selection color (when user select a option from
sidebar)willnotwork.

4. HowI
can changethecomponenticon/textdefaultcolorandselectioncolor?
Goto appjavacomaudacityit.audacityutilColorUtil and
findthere:
NAV_ICON_COLOR_NORMAL
(iconnormalcolor),
NAV_ICON_COLOR_CHECKED
(iconcheckedcolor),
NAV_TEXT_COLOR_NORMAL
(textnormalcolor),
NAV_TEXT_COLOR_CHECKED
(textcheckedcolor).

Changethecorrespondingcolorwithyourpreferablecolor.

5. MayIchangethecomponentnameattheleftnavigationdrawerandhow?
Goto res menu nav_menu_drawer.xml . You will find the options
shown innavigationdrawerin the <item>tag with ,
id icon and title.
You
can change the title by editing
android:title
attribute. For example you
want to change the
Clients name.Do the modificationat line number 25
as
here.

6. CanIhideanyitemifIdontwanttoshowattheleftnavigationdrawerandhow?
Yes you can. If you dont wantto show an item in draweryoucan easily
hide an item. For that youve to comment out the corresponding <item>
block. Youve to select the whole <item>
block and press
ctrl+/ key on
keyboard. For example If you want to hide Methodology you can doas
here
.

7. MayIaddmorecomponents/optionsattheleftnavigationdrawerandhow?
Sorry,rightnowwedonthavesupporttodo that.Butifyoureadeveloper
youcandothemodificationeasily.

Homepage:

1. HowIcanaddordeleteprojectinapphomepage?
We are using J SON (JavaScript Object Notation) for managing the data
structure in our template. You can easily insert/update data if youve
minimumlevelofknowledgeofhowtoworkwith JSON.
You can easily add or delete project by editing json file associated with
homepage. For that go to app assets json home . Youwillfind
some json text there. This is a json array with the name projects which
holds several projects shown in the homepage. If you want to add or
deleteprojectyouvetoidentifyasingleprojectonthatfile.Checkthis out.
You can identify the starting and ending clause as shown in the image.
Everyprojectdeclaration isseparatedbyacommaexceptthelastproject.
Check this out. Every project has its own name ,
image,
project_info (a
jsonarray collection of platform and url
). Here image value (i.e:
img_home_5 ) describethefilename oftheimage that are locatedonthe
drawable (xhdpi) folder under res. If you are okay with the above
discussionyouaregoodtoeditourjsonfiles.
For adding a new project see this
. We created a new project by adding
new project property like name as
Your Project Name. You will name it
according to yours. We inputted an image with the name
img_your_project. Changethe name according toyoursanddontforget
to keep the imagefile inthe
resdrawable folder.Ifthenamewrittenin
the json file and the name of theimage mismatchthenimage willnotbe
shownonscreenandexceptionmayoccur.Doit carefully !
Now suppose we want to add new platform info in our newly added
project.Checkout this
.
Now suppose we want to delete an existing app, for example:
Amar
Phonebook.
Forthatcheckthis out.

2. HowI
canchangetheprojectimage,title,platformnameandprojecturlathome
page?
Ifyouareokaywithstep1youvealreadydonethis.Thereafterweare
explaining.Youcanchangetheimagenameeasilybychangingthename
of
image field.Butbeforethatmakesureyouveputtedtheimageinthe
resdrawable folderwiththesamenamementioninginthejsonfile.
Changeprojecttitlebychangingthevalueofthe name field.
Changeprojectplatformnameandurlbychangingthevalueof platform
andurl
fieldrespectively.
Checkthis out.

3. Whatistherequiredsizeofthehomepageimage?
As the images are shown in portrait view we used portrait images
(resolution640 x 1138 px).Wesuggestyou tokeepportraitimageaspect
ratioandfilesizeshouldbenotmorethan150KBforbetterperformance.

OverviewPage:

1. HowI
canchangethebackgroundimage,companyicon,nameandslogan?
Goto appassetsjsonoverview jsonfileandyoucanedityour
necessarychangeseasily.Butkeepinmindtoputtheimagefilesinthe
resdrawable folder.
Jsonfieldsandtheirusagearegivenbelow:
company_icon:
Filenameof
thelogoshowninoverviewpage.
background_image: Filenameoftheimageshowninbackgroundofthe
upperpartoftheoverviewpage.
company_name: nameofthecompanyyouwanttodisplayatoverview
page.Changeaccordingtoyours.
company_tag: sloganofyourcompany.

2. Whatistherequiredsizeforbackgroundimageandcompanyicon?
Werecommendtofollowtheaspectratioofthebackgroundimagewe
used.Weused img_overview_parallax asbackgroundimage.Tryto
keepthefilesizenotmorethan150KB.
Weareusing ic_overview_company (200x200px)ascompanyicon.
Youcanfollowtheresolution,paddingforbestfittingyourlogointo
screen.

3. HowI
canchangethenumericvalue?HowI canchangethenumericvalues
componentlikeCompleted,Inqueueandwaitingsection?
You can changenumericvaluesbyediting numberand text field.Check
this
out. You will see there are three(3) counter info has identified. We
restrict the counterinfo into threeitemsbecause wearesupportingonly
three items to show there . So we recommend to use three counter
items. If you want to display less than 3 items the view will looksempty
andfrail.
change number value (i.e: 20+/3/10+) and text
field like (i.e:Completed,
Developing, In Queue). Keep in mind that the text
value will be shown
withanewlineafterthe number field.Checkthis out
.

4. CanIaddoverviewitemandhow?Whatistheitemsimagesize?
You can add as many items you want to the json. Youve to add title
,
body and image inside basic_info jsonarrayasanewinfo.Where image
represent the info icon forthespecific info. Checkout
this
. If you wantto
add multiline text in
bodyfield you should add
\n
symbolbefore the new
line.Checkthisout .
We recommend to use exact 48 x 48 px image for the info icon. Dont
forgettoputthoseiconfilesinto resdrawable (xhdpi)folder.

Portfoliopage:

1. HowIcanaddprojectatportfoliopage?
Youcaneasilydothatbygoingto appassetsjsonportfolio file.
Supposewewanttoaddanewprojectwhichwillbeshownatthefirstrow
ofthelist.Checkthis out.

2. Whatstheimagesizeofprojectitem,howtoaddprojectnameandnewplatform
ofproject?
Weve used image files name starting with img_portfolio_ (i.e:
img_portfolio_1.jpg, img_portfolio_2.jpg etc.). Try tokeeptheaspectratio
(i.e: 655 x 327 px) we maintained and the imageformatshould be JPG .
The file size should be as little as possible.Because
large file sizecan
producelagwhilescrollingatportfolioscreen .
Foraddingnewprojectnameandnewplatformcheck this
out.

3. Howtochangefilters(FloatingActionButtons)itemname?Howtoaddor
remove?Whatsthesizeoficoninfilterlist?
If you want to change the root menu icon just rename yourdesired icon
into
ic_fab_filter andpaste(replace)itintoresdrawable (xhdpi)folder.
You can easily do that by going to
app assets json filter file.
Justeditthetitle
fields.
ForaddorremoveFABitemscheckthis out .
ForFABiconuse48x48pxicon.

4. HowIcanchangeFABiconbackgroundcolorandpressedcolor?
Just change the menu_color and menu_pressed_color field carefully.
Inputthecolorcodewithhexadecimalformat.

5. HowIcanaddshareoptioninportfolio?
Wedontallowtoaddshareoptioninportfoliotoshareapp.Ifyouwantto
dosoyouneedtodosomecoding.Butwewillincludethisfeatureinnext
release.

Team:

1. HowIcanaddmoreordeleteexistingteammembers?Howtochangeimage,
Name&Designationfields.
Goto appassetsjsonteam andfollow
this
.
Just edit
name (For member name), designation, image (file name for
membericon)fields.

2. Whatistherequiredsizetochange theimageoftheteammembers ?
Wearenotrecommendinganyfixedsizeforthat.Youcanfollowours.But
trytokeepfilesizesmallerforbetterperformance.Itsnotmandatoryto
usecircleicons. Theappwillmakecircleiconsprogrammatically.

Clients:

1. HowI
can changetheclientscompanylogooftheclientspage?Whatisthe
requiredsizeofthelogo?
Go to app assetsjsonclient andchangethevalueofthe image
field.
We recommend you to use approx. 100 x 100 px imagefor clientslogo.
Alsotrytokeepfilesizesmaller.
2. HowI
can changetheclientsname,delegatename,country&platformofthe
projectwithURL?
Youwillfindeveryclient block withthefollowingproperty.changethe
respectivevaluesaccordingtoyours.
client_name :thisfieldisforthenameoftheclient/companyyour
companyworkedfor.
delegate_name :delegatenameonbehalfofthecompany
country :companyregion
image :imagefilenameoftheclient/company
platform :nametheplatformyourcompanyworkedforthe
client/company.
url:urltheprojectyourcompanyworkedforthe
client/company.

3. Howtoaddnewplatform?
Check this
out.

Testimonial:

1. HowI
can changethedelegatesimageandwhatis therequiredsize ?
Go to app assets jsontestimonial and change thevalueofthe
delegate_image field.
Try to use square size image with a small file size for better view and
performance.Weareusing110x110pximage.

2. HowI
can changethedelegatesname,designationandcomments?
Justchangethevalueof delegate_name,
delegate_designation and
comment filed.

3. WhatisreferenceurlandhowIcanchangeit?
referenceurlistheweburlwhereuserwillberedirectedwhentapon
worldicononthelistitemontestimonialscreen.
Youcanchangeitaccordingtoyoursbychangingthevalueof ref_url
field.

4. HowIcanaddanewtestimonialordeleteaoldone?
Checkout this.

Methodology:

1. HowIcanchangethebackgroundimageandwhatis therequiredsize ?ShouldI


havechangethelogoofthecompanyoritwillgetfrompreviouscompanylogo?
Ifyouve alreadyset the header backgroundand header company icon in
Left navigation drawer part you dont need to change to set it here.
Because we are using the same image here also. But ifyouwant toset
differentone youveto goto
appassets jsonmethodology and
change the value of the background_image and company_icon. Put
thoseimagefilesinto resdrawable (xhdpi)foldertoo.
If you have notchanged the imageyoucan skipthisstep. Here wehave
used 400 x 226 px imagefor the background_image .You canuseyour
own size. But we highly recommend to not to use very high resolution
image. Also keepconcernabouttheaspectratio.Youcanfollowourgiven
size.
If you have not changed the image youcan skipthisstep. We areusing
app_inside_logo.png (865 x 490 pixel) as company icon. We will not
suggest youto fix the image dimension in thespecific size buttrytokeep
theaspectratioasweusedinouricon.

2. HowIcanchangethetextofthecontentheadinganddescription?
Goto appassetsjsonmethodology andchangethevalueof
theheading anddescription field.

3. HowIcanchangethecontentheadingiconandwhatis therequiredsize ?
Justchangetheimagefieldvaluewithwithyouriconname.
We recommend to use exact 48 x 48 px image for the info icon. Dont
forgettoputthoseiconfilesinto resdrawable (xhdpi)folder.

Social:

1. HowIcanchangethesocialmediasurl?
Go to res values strings.xml and change the following attribute
name value: dev_fb ,
dev_linked_in ,
dev_twitter ,
dev_youtube. Check
outthis
.

2. AmIavailabletoaddmoresocialmediaURL?Ifyeshow?Andwhatsthesizeof
image?
No,Youarenotsupposedtoaddmoresocialurl.Wewilladdthisfeature
infuturerelease.Butifyouwanttoaddsocialurlasyourchoiceyouhave
tochangetheassociatedlayoutfile( resfragment_social.xml )and
alsosomeprogrammingon appjavacomaudacityit.audacity
fragmentsSocialFragment.

FAQ:

1. HowI
can
changethequestionandansweroftheFAQ?
Gotoappassetsjsonfaq andeditthevalueofthe
q
fieldfor
questionand
a
fieldforanswer.

You might also like