Edge datafield coding structure

I made a datafield 4 years ago, and now I am re-taking it. 4 years ago after the installation I had to restart the edge, and after that the DF worked, otherwise the IQ letters on the middle of the screen were the only thing that showed up. I am recoding it again this month and apparently it works fine, it just that on the connect IQ app it showed as queued after I clicked install... and only after I restart the edge it showed up as installed.  I think maybe something in the basic structure of my code is wrong so hopefully somebody can guide me. 

So the IQ symbol issue is one the help needed to get ride of it, and the other issue is why what every I draw on the "onLayout(dc)", is not showing up on the edge/simulation.

Hopefully somebody can understand what I am doing wrong. Aside of that, the DF works really nice, and all the riders in my group liked it.

import Toybox.Activity;
using Toybox.Graphics as Gfx;
import Toybox.Lang;
using Toybox.WatchUi as Ui;
import Toybox.Time;
using Toybox.Math;
using Toybox.UserProfile as UserProfile;
using Toybox.System as Sys;
using Toybox.Weather;

class MTBVallesVcomplexView extends Ui.DataField {

// here I define all the variables used

    function initialize (){
        Datafield.initialize();
        hasWeather = (Toybox has : Weather);
    }
    
    function onLayout(dc) as Void {
         // Here I assign original values like screenwidth = dc.getWidth();
        // and make calculation of coordenates and assign them to vars to use
        // them later
        // one issue is that I tried to draw a figure like a circle
        // to stay there for ever on the screen but it did not show up when
        // simulating/running the code
    
    }

    function compute(info as Activity.info) as Void {
    
    // used to get activity.info stuff, like current speed, current cadence etc.
    // create coordenates based on that information and assign them to vars
    // that will be used to draw something on onupdate
    }
    
    function onUpdate(dc) as Void {
    // based on vars defined globally or coordenates obtained within
    // functions onLayout or Compute I make the drawings and text of 
    // the dinamic interface I want to present the data. use drawlines, circles
    // arcs, rectangles, etc. 
    }
    
    // and on the last sections I created functions to work as procedures
    // and others to work as functions. I am from the old programming school 
    // where you can have procedures that just do stuff but does not return
    // anything and functions that return a value. 
    // below is an example of both. SetPowerZones just do something that could
    // be included at onLayout, but instead of writting all those line 
    // I just called this function.
    // and the GetHRColor, I assign a color to that according the the 
    // input received as parameter.
    
    function setPowerZones() {
   		FTP= Application.Properties.getValue("FTP");  
   		PWRZones[0] = (FTP)*0.25;
   		PWRZones[1] = (FTP)*0.55;
   		PWRZones[2] = (FTP)*0.74;
   		PWRZones[3] = (FTP)*0.89;
   		PWRZones[4] = (FTP)*1.04;
   		PWRZones[5] = (FTP)*1.20;
   		PWRZones[6] = (FTP)*1.49;  		
   }
  
	function getHRColor(hrt){
		var colorHR;
		
		if (hrt == null || hr < mHRZones[0]) {
			colorHR = HRColor[0];
		} else if (hrt < mHRZones[1]) {
			colorHR = HRColor[1];
		} else if (hrt < mHRZones[2]) {
			colorHR = HRColor[2];
		} else if (hrt < mHRZones[3]) {
			colorHR = HRColor[3];
		} else if (hrt < mHRZones[4]) {
			colorHR = HRColor[4];
		} else {
			colorHR = HRColor[5];
		}
		return colorHR;
	}
    
}