No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    1. Home
    2. don
    D
    • Profile
    • Following 0
    • Followers 0
    • Topics 2
    • Posts 4
    • Best 1
    • Groups 0

    don

    @don

    2
    Reputation
    227
    Profile views
    4
    Posts
    0
    Followers
    0
    Following
    Joined Last Online

    don Follow

    Best posts made by don

    • RE: Custome Spinner

      After digging on the codes a was able to create my own spinner

      create this file and use it like a custom component

      //src\components\LogoSpinner.js
      
      import Vue from "vue";
      
      import mixin from "quasar/src/components/spinner/spinner-mixin.js";
      
      export default Vue.extend({
        name: "LogoSpinner",
      
        mixins: [mixin],
      
        render(h) {
          return h(
            "svg",
            {
              staticClass: "q-spinner",
              class: this.classes,
              on: this.$listeners,
              attrs: {
                stroke: "currentColor",
                width: this.cSize,
                height: this.cSize,
                viewBox: "0 0 57 57",
                xmlns: "http://www.w3.org/2000/svg"
              }
            },
            [
              h(
                "g",
                {
                  attrs: {
                    transform: "translate(1 1)",
                    "stroke-width": "2",
                    fill: "none",
                    "fill-rule": "evenodd"
                  }
                },
                [
                  h(
                    "circle",
                    {
                      attrs: {
                        cx: "5",
                        cy: "50",
                        r: "5"
                      }
                    },
                    [
                      h("animate", {
                        attrs: {
                          attributeName: "cy",
                          begin: "0s",
                          dur: "2.2s",
                          values: "50;5;50;50",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      }),
                      h("animate", {
                        attrs: {
                          attributeName: "cx",
                          begin: "0s",
                          dur: "2.2s",
                          values: "5;27;49;5",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      })
                    ]
                  ),
                  h(
                    "circle",
                    {
                      attrs: {
                        cx: "27",
                        cy: "5",
                        r: "5"
                      }
                    },
                    [
                      h("animate", {
                        attrs: {
                          attributeName: "cy",
                          begin: "0s",
                          dur: "2.2s",
                          from: "5",
                          to: "5",
                          values: "5;50;50;5",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      }),
                      h("animate", {
                        attrs: {
                          attributeName: "cx",
                          begin: "0s",
                          dur: "2.2s",
                          from: "27",
                          to: "27",
                          values: "27;49;5;27",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      })
                    ]
                  ),
                  h(
                    "circle",
                    {
                      attrs: {
                        cx: "49",
                        cy: "50",
                        r: "5"
                      }
                    },
                    [
                      h("animate", {
                        attrs: {
                          attributeName: "cy",
                          begin: "0s",
                          dur: "2.2s",
                          values: "50;50;5;50",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      }),
                      h("animate", {
                        attrs: {
                          attributeName: "cx",
                          from: "49",
                          to: "49",
                          begin: "0s",
                          dur: "2.2s",
                          values: "49;5;27;49",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      })
                    ]
                  )
                ]
              )
            ]
          );
        }
      });
      
      posted in Framework
      D
      don

    Latest posts made by don

    • RE: Custome Spinner

      After digging on the codes a was able to create my own spinner

      create this file and use it like a custom component

      //src\components\LogoSpinner.js
      
      import Vue from "vue";
      
      import mixin from "quasar/src/components/spinner/spinner-mixin.js";
      
      export default Vue.extend({
        name: "LogoSpinner",
      
        mixins: [mixin],
      
        render(h) {
          return h(
            "svg",
            {
              staticClass: "q-spinner",
              class: this.classes,
              on: this.$listeners,
              attrs: {
                stroke: "currentColor",
                width: this.cSize,
                height: this.cSize,
                viewBox: "0 0 57 57",
                xmlns: "http://www.w3.org/2000/svg"
              }
            },
            [
              h(
                "g",
                {
                  attrs: {
                    transform: "translate(1 1)",
                    "stroke-width": "2",
                    fill: "none",
                    "fill-rule": "evenodd"
                  }
                },
                [
                  h(
                    "circle",
                    {
                      attrs: {
                        cx: "5",
                        cy: "50",
                        r: "5"
                      }
                    },
                    [
                      h("animate", {
                        attrs: {
                          attributeName: "cy",
                          begin: "0s",
                          dur: "2.2s",
                          values: "50;5;50;50",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      }),
                      h("animate", {
                        attrs: {
                          attributeName: "cx",
                          begin: "0s",
                          dur: "2.2s",
                          values: "5;27;49;5",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      })
                    ]
                  ),
                  h(
                    "circle",
                    {
                      attrs: {
                        cx: "27",
                        cy: "5",
                        r: "5"
                      }
                    },
                    [
                      h("animate", {
                        attrs: {
                          attributeName: "cy",
                          begin: "0s",
                          dur: "2.2s",
                          from: "5",
                          to: "5",
                          values: "5;50;50;5",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      }),
                      h("animate", {
                        attrs: {
                          attributeName: "cx",
                          begin: "0s",
                          dur: "2.2s",
                          from: "27",
                          to: "27",
                          values: "27;49;5;27",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      })
                    ]
                  ),
                  h(
                    "circle",
                    {
                      attrs: {
                        cx: "49",
                        cy: "50",
                        r: "5"
                      }
                    },
                    [
                      h("animate", {
                        attrs: {
                          attributeName: "cy",
                          begin: "0s",
                          dur: "2.2s",
                          values: "50;50;5;50",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      }),
                      h("animate", {
                        attrs: {
                          attributeName: "cx",
                          from: "49",
                          to: "49",
                          begin: "0s",
                          dur: "2.2s",
                          values: "49;5;27;49",
                          calcMode: "linear",
                          repeatCount: "indefinite"
                        }
                      })
                    ]
                  )
                ]
              )
            ]
          );
        }
      });
      
      posted in Framework
      D
      don
    • Exit my app on click back button

      My app start with a welcome page with a spinner waiting for an ajax call, then redirect to login page, here i don’t want my user to go back to the welcome page. any suggestion ?

      posted in Help
      D
      don
    • RE: Is there a easy way to remove an entry from the browser history.

      Same problem here

      posted in Framework
      D
      don
    • what is the best way to use google maps ( /vue2-google-maps OR mapsplugin/cordova-plugin-googlemaps)

      I would like to use google map in my project but i don’t know what is optimized,
      i would like to use the cordova plugin but for testing it require compilation, i would like to test in the browser directly,
      the vue2-google-maps seems good but i’ve install it and i’m just getting a blank page.

      someone has any suggestion ? especially for the cordova plugin if i can test it in my computer without to compile any time.

      or if there is a good library you can also suggest me

      posted in Framework
      D
      don